前言： 在我的編程世界里，一直強調可維護性和健壯性，其次才是性能，不夠優秀，不敢說對代碼有潔癖。 試想，前者成立，性能是否也會有所提升呢！本文中，研究如何讓我們的代碼更加優雅，清晰明了。 * **Api請求，結果解構方式，并且添加finally** *****  * **通過Object 替換switch** ***** 如下圖，`switch`語法很長，對比與對象方式，看著沒那么舒服吧  使用obj[xxx]取值，就簡潔多了  * **在 Vue業務組件中，多條件組合時，通過計算屬性整合** *****  * **在Vue中，多個動態class時，通過計算屬性整合** *****  * **取Vuex值時，利用...mapState()** *****  * **ElementUI表單中resetFields()與clearValidate()方法** ***** 我相信很多人在做表單彈窗時，清除數據或者說彈框隱藏，其內容體采用`v-if`的方式，我認為這個方式太粗暴了！！！ 對于追求這點性能的我，**重置表單配合清空校驗**的方式，還不錯哦 ``` // 前提 this.$refs['ruleForm'] !== undefined 等情況 this.$refs['ruleForm'].resetFields() this.$refs['ruleForm'].clearValidate() ``` * **reduce()替代flat()，flat解決兼容問題** ***** ``` export function flattenDeep(arr?=?[])?{ return arr.reduce((acc,?val)?=>Array.isArray(val)???acc.concat(flattenDeep(val))?:?acc.concat(val),?[]) } ``` * **CodeMetrics插件** ***** vscode安裝此插件，可以顯示基本的復雜度，作為參考將此數值進行差分 | x復雜度數 | 描述 | | --- | --- | | x <= 10 | 簡單 | | 10 < x <= 30 | 中等 | | x > 30 | 復雜：建議拆分 | | 如圖 |  | * **函數入參數量** ***** 函數參數建議不超過3個，超過建議使用Object，并結構 ``` function createMenu({ title, body, buttonText, cancellable }) { // ... } ``` https://mp.weixin.qq.com/s/P8PEI2GNPgylNrs4qukWww