七步寫出優秀的JS程式碼
阿新 • • 發佈：2019-01-28
原文地址：http://www.creativebloq.com/netmag/7-steps-better-javascript-51411781?utm_source=javascriptweekly&utm_medium=email
很好的一篇文章，全是乾貨，總結和翻譯了此文。
使用嚴格模式：
在函式中新增 “use strict”; 宣告，嚴格模式的說明見 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode
模組化：
每個模組來封裝自己的方法實現，避免全域性變數洩露，並且可以更好地組織程式碼介面，可以方便地按模組進行單元測試。
常用的模組載入器有：requires（requirejs.org），seajs（seajs.org)，browserify(browserify.org)等。
統一的編碼規範：
如：Google Javascript Style Guide http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml
使用版本控制系統：
使用版本控制，方便多人合作。除了一些老的系統，基本上都是用 git，程式碼可以直接託管到github（http://jshint.com/)
寫好函式的塊級註釋，然後可以使用 YUIDoc(
用 Markdown （http://daringfireball.net/projects/markdown/）來生成更詳細更長的說明文件。
這樣可以非常有效的避免語法層面的錯誤，比如沒有使用嚴格模式、忘記宣告變數、括號不匹配等。
詳盡的單元測試可以極大提升程式碼的健壯性。
可以用 jasmine（http://jasmine.github.io/）或者 Qunit(http://qunitjs.com/)等測試框架來編寫單元測試。
有了單元測試之後，還可以使用BrowserStack（http://browserstack.com/）或者SauceLabs（http://saucelabs.com/）等工具在不同的瀏覽器下跑測試，JS的瀏覽器相容性問題再也不用擔心了。
可以使用程式碼覆蓋工具檢查單元測試的覆蓋率，保證100%的單元測試覆蓋率。
使用函式複雜性測試工具 http://netm.ag/halstead-249， 他可以通過檢查函式體中包含的迴圈、分支、函式呼叫等來判斷函式的複雜程度。複雜度越底的函式越容易理解和維護。命令列工具plato（http://github.com/es-analysis/plato）可以用來生成程式碼的複雜性報告，可以幫助判斷哪些函式過於複雜需要優化。
Grunt 官網：gruntjs.com
對照以上七步，看看自己的程式碼離“優秀的JS程式碼”還有多遠。
很好的一篇文章，全是乾貨，總結和翻譯了此文。
1，程式碼
使用嚴格模式：
在函式中新增 “use strict”; 宣告，嚴格模式的說明見 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode
模組化：
每個模組來封裝自己的方法實現，避免全域性變數洩露，並且可以更好地組織程式碼介面，可以方便地按模組進行單元測試。
常用的模組載入器有：requires（requirejs.org），seajs（seajs.org)，browserify(browserify.org)等。
統一的編碼規範：
如：Google Javascript Style Guide http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml
使用版本控制系統：
使用版本控制，方便多人合作。除了一些老的系統，基本上都是用 git，程式碼可以直接託管到github（http://jshint.com/)
2，文件
要把文件提高到和原始碼同樣的重視程度。寫好函式的塊級註釋，然後可以使用 YUIDoc(
用 Markdown （http://daringfireball.net/projects/markdown/）來生成更詳細更長的說明文件。
3，語法檢查
使用 jsHint(http://jshint.com/), 或者 jsLint(http://jslint.com/)來檢查程式碼。這樣可以非常有效的避免語法層面的錯誤，比如沒有使用嚴格模式、忘記宣告變數、括號不匹配等。
4，單元測試
前面提到了模組化，模組化好的程式碼可以非常容易按模組編寫單元測試。詳盡的單元測試可以極大提升程式碼的健壯性。
可以用 jasmine（http://jasmine.github.io/）或者 Qunit(http://qunitjs.com/)等測試框架來編寫單元測試。
有了單元測試之後，還可以使用BrowserStack（http://browserstack.com/）或者SauceLabs（http://saucelabs.com/）等工具在不同的瀏覽器下跑測試，JS的瀏覽器相容性問題再也不用擔心了。
5，Measure
不知道應該怎麼翻譯，“測量”？可以使用程式碼覆蓋工具檢查單元測試的覆蓋率，保證100%的單元測試覆蓋率。
使用函式複雜性測試工具 http://netm.ag/halstead-249， 他可以通過檢查函式體中包含的迴圈、分支、函式呼叫等來判斷函式的複雜程度。複雜度越底的函式越容易理解和維護。命令列工具plato（http://github.com/es-analysis/plato）可以用來生成程式碼的複雜性報告，可以幫助判斷哪些函式過於複雜需要優化。
6，自動化
基於Grunt的自動化構建。強大的Grunt可以實現幾乎所有的構建操作，包括：生成文件、語法檢查、合併編譯壓縮、單元測試、複雜性測試，甚至可以自動幫你重新整理頁面。有了grunt，在修改原始碼之外的操作全部可以自動化進行。Grunt 官網：gruntjs.com
7，處理異常
使用 try catch來處理異常，確保非致命的錯誤發生時不會影響整個程式的執行。對照以上七步，看看自己的程式碼離“優秀的JS程式碼”還有多遠。