閱讀JAVAScript代碼時，你有沒有感覺：
- 你幾乎不明白代碼的作用？
- 代碼使用了很多JavaScript技巧？
- 命名和編碼風格相當隨機？
這些是編碼習慣不良的跡象。
在這篇文章中，我描述了JavaScript中常見的5種不良編碼習慣。重要的是，我將就如何擺脫這些習慣提出可行的建議。
1.不要使用隱式類型轉換
JavaScript是一種松散類型的語言。如果使用得當，這是一個好處，因為它給你帶來了靈活性。
使用不同類型的操作數時，大多數運算符+ - * / ==（但不是===）使用類型的隱式轉換。
該聲明if (condition) {...}，while(condition) {...}含蓄地變換的條件為布爾值。
以下示例依賴于類型的隱式轉換。我敢打賭你會感到困惑：
過度依賴隱式類型轉換是一個壞習慣。首先，它使您的代碼在邊緣情況下不太穩定。其次，您增加了引入難以重現和修復的錯誤的機會。
讓我們實現一個獲取對象屬性的函數。如果該屬性不存在，則該函數返回默認值：
getProp()讀取name屬性的值，即'Batman'。
嘗試訪問isVillian屬性怎么樣：
console.log(getProp(hero, 'isVillian', true)); // => true
那是一個錯誤。即使hero屬性isVillian是false，函數getProp()返回錯誤true。
這是因為屬性存在的驗證依賴于隱式轉換為布爾值if (!object[propertyName]) {...}。
這些錯誤很難發現。要修復該函數，請明確驗證值的類型：
object[propertyName] === undefined驗證屬性訪問者是否評估到的確切內容undefined。這里建議避免直接使用 undefined。因此，上述解決方案可以進一步改進：
盡可能不要使用隱式類型轉換。相反，請確保變量和函數參數始終具有相同的類型，必要時使用顯式類型轉換。
最佳實踐列表：
- 始終使用嚴格相等運算符===來執行比較
- 不要使用松散的相等運算符 ==
- 加法運算符operand1 + operand2：兩個操作數應該是數字或兩個字符串
- 算術運算符- * / % **：兩個操作數都應該是數字
- if (condition) {...}，while (condition) {...}等等語句：condition應該是一個布爾值
您可能會說這種方法需要編寫更多代碼......您說得對！但是通過明確的方法，您可以控制代碼的行為。此外，顯性提高了可讀性。
2.不要使用舊的JavaScript技巧
JavaScript的有趣之處在于，它的創建者沒有料到這種語言會如此流行。
基于JavaScript構建的應用程序的復雜性比語言發展的速度還要快。這種情況迫使開發人員使用JavaScript技巧和變通方法，只是為了讓事情正常運行。
一個典型的例子是查看數組是否包含某個元素。我從來不喜歡使用 array.indexOf（item）！==-1來檢查。
ES6 及以后版本的功能要強大得多，可以使用新的語言特性安全地重構許多技巧。
ES6 中可以使用 array.includes(item) 來代替 array.indexOf(item)!==-1
3. 不要污染函數作用域
在ES2015之前，你可能會養成了將所有變量聲明在函數作用域里面。
來看看一個例子：
變量 index、item和 length 在函數作用域內。但是這些變量會影響函數作用域，因為它們只在 for()塊作用域內才被需要。
通過引入具有塊作用域 let和 const，應該盡可能地限制變量的生命周期。
index和 item 變量被限制為 for()循環塊作用域。length 被移動到使用地方的附近。
重構后的代碼更容易理解，因為變量不會分散在整個函數作用域內，它們存在于使用地方的附近。
在使用的塊作用域定義變量
if 塊作用域
for 塊作用域
4.盡量避免 undefined 和 null
未賦值的變量默認被賦值為 undefined。例如
count變量已定義，但尚未使用值初始化。JavaScript隱式賦值給它 undefined。
訪問不存在的屬性 hero.city時，也會返回 undefined。
為什么直接使用 undefined是一個不好習慣？因為與 undefined進行比較時，你正在處理未初始化狀態的變量。
變量、對象屬性和數組在使用前必須用值初始化
JS 提供了很多避免與 undefined進行比較方式。
判斷屬性是否存在
對象的默認屬性
默認函數參數
null是一個缺失對象的指示符。應該盡量避免從函數返回 null，特別是使用 null作為參數調用函數。
一旦 null出現在調用堆棧中，就必須在每個可能訪問 null的函數中檢查它的存在，這很容易出錯。
嘗試編寫不涉及 null的代碼。可替代方法是 try/catch機制，默認對象的使用。
5. 不要使用隨意的編碼風格，執行一個標準
有什么比閱讀具有隨機編碼風格的代碼更令人生畏的事情？你永遠不知道會發生什么！
如果代碼庫包含許多開發人員的不同編碼風格，該怎么辦?，這種就像各色人物涂鴉墻。
整個團隊和應用程序代碼庫都需要相同的編碼風格，它提高了代碼的可讀性。
一些有用的編碼風格的例子：
- Airbnb JS 風格指南
- 谷歌 JS 風格指南
老實說，當我在回家前準備提交時，我可能會忘記設計代碼的樣式。
我自己總說:保持代碼不變，以后再更新它，但是“以后”意味著永遠不會。
這里建議使用 eslint 來規范編碼風格。
- 安裝eslint
- 使用最適合自己的編碼風格配置 eslint
- 設置一個預提交鉤子，在提交之前運行eslint驗證。
總結
編寫高質量和干凈的代碼需要紀律，克服不好的編碼習慣。
JavaScript是一種寬容的語言，具有很大的靈活性。但是你必須注意你所使用的特性。這里建議是避免使用隱式類型轉換， undefined 和 null 。
現在這種語言發展得相當快。找出復雜的代碼，并使用最新 JS 特性來重構。
整個代碼庫的一致編碼風格有益于可讀性。良好的編程技能總是一個雙贏的解決方案。
