如何更優雅的寫好JavaScript？

筆者以前寫Javascript的時候，經常會把代碼寫的又臭又長又啰嗦。

在經過一段實踐的實踐和反思后，代碼的優雅性應該提高很多。所以個人就總結了寫出優雅Javascript代碼的心得。

不寫分號

不寫分號能顯著讓代碼更加優雅，并少輕松你的雙手。可能很多人會有疑問，沒有分號的Javascript也能正常運行？幾乎是的。不過在一些特殊的時候Javascript引擎并不會幫助你正確插入分號。具體的情況只有這五個符號：， ，， ， 沒了。也就是說，凡是新的一行代碼以上述五個符號開頭，那么之前一句的末尾是需要分號的。而在實際情況中，以+，- 開頭的新一行代碼幾乎不可能出現。所以可能情況：

如果之前沒加分號，那么這個匿名函數外的括號會調用上一行定義的函數，匿名函數就變成了參數。記住下面的這個分號

還有比如這樣

除了上面例子，幾乎沒有其他情景需要加分號了。所以經常遇到這種情況，一個javascript文件里幾百個分號全是沒必要的。而且，通常在生產環境中會提前用uglify.js去壓縮代碼，或是用ES6時babel轉碼，這都會幫你補全分號。所以還有什么理由去寫分號呢？當然寫不寫分號也屬于個人習慣，知道什么時候分號是不可省的才是重點。PS：Vue.js的源碼就是不寫分號的。

使用ES6

相比較ES5，ES6的語法中的結構賦值，箭頭函數，模板字符串，對象的簡寫法等都能讓代碼變得干凈利落。比如一個判斷奇偶的函數

ES6：

比如字符串拼接

ES6：

一些優雅的寫法

邏輯運算符

初始化變量

三元運算符

合理的命名

具體來說有這樣幾點：

方法名以動詞開頭，比如 布爾值以is開頭，駝峰大小寫和下劃線不要混用，比如和下劃線只有在私有對象屬性時使用方法內部變量盡可能短變量聲明

變量聲明盡可能的放在開頭，這樣有助于：

提供一個單一地址查找到函數所有需要的局部變量防止因聲明提升所引發的邏輯錯誤幫助牢記要聲明的變量，盡可能地少適用全局變量

使用逗號隔開換行，而非每一行重新

有的時候也可以把逗號寫在開頭，這樣比較方便加入新的變量

對齊方式

實際上用var的時候是可以用逗號的。所以在ES6中更經常出現的情況:

縮短常用方法名避免超長代碼

如果代碼長到底部的滾動條都出現了，如何算得上優雅呢。所以要保持每一行的代碼不要太長，具體有這樣需要注意的地方：

內部不重要的過程性代碼盡可能短，但至少保留語義如果用到鏈式語法，可在 ' . '的開頭換行

可以改成

字符串拼接時，用加號換行，或用ES6的模板字符串如果因為邏輯運算符兒導致過長，可以將邏輯運算符換行如果函數參數過長，可以將參數換行，也是沒問題的盡可能避免嵌套過多的語句如果還是很長，可以嘗試2個空格縮進其他細節代碼不同功能區之間加空行，比如每個funtion之間對于數組或類數組，可以用map等函數替代for循環如 號的運算符之間加空格若多次引用同一外部對象的屬性，則定義到方法內部