首頁 >web前端 >js教程 >7個讓JavaScript變得更好的注意事項_javascript技巧

7個讓JavaScript變得更好的注意事項_javascript技巧

WBOY
WBOY原創
2016-05-16 16:17:27942瀏覽

   隨著瀏覽器效能提高,伴隨著新的HTML5的程式介面的穩定採用,網頁上的JavaScript的音量逐漸增加。然而,一個寫得不好的程式編碼卻擁有著打破整個網站,讓用戶為之沮喪和驅趕潛在客戶的潛力。
  開發人員必須使用所有供他們任意使用的工具和技術來提升他們的程式碼的質量,並有信心確認每次的執行都是可以預見的。這是一個在我心靈深處的話題並且我已經工作多年找到一組開發過程中來遵循的步驟以確保只有最高品質的程式碼可以被發布。
  您只要按照這七個步驟操作就會大大提升您的JavaScript專案的品質。使用這個工作流程,錯誤將會減少並且將許多處理優化,讓使用者擁有一個愉悅的上網瀏覽體驗。

01.代碼

  首先在你的函數裡調用ECMAScript5的嚴格模式和一個「嚴格模式」的聲明,並使用該模組的設計模式,在自執行的函數閉包裡,透過沙箱獨立的程式碼模組盡量減少全局變數內的使用,透過任何外部依賴關係以保持全域變數模組清晰,簡潔。只有使用已建立好的,行之有效的,已通過測試並結果良好的第三方的函數庫和框架,並保持你的函數處於小值,從你的模組操作和其他視圖層程式碼中分離出任何業務邏輯或資料。
有多個開發人員的較大的專案應該遵循一套既定的編碼原則,如Google的JavaScript的風格指南,並需要更強的程式碼管理規則,包括透過一個函式庫,如RequireJS,使用軟體包管理使用非同步模組定義(AMD)進行嚴格的依賴關係管理,使用Bower或Jam(客戶端庫管理工具)的包裝管理來參考您的依賴項檔案的特定版本,並採用結構設計模式,如觀察者模式,以方便您不同的程式碼模組之間的鬆散耦合通訊。這也是一個明智的想法:使用程式碼儲存庫系統體系,如Git或Subversion,透過一些服務如原始碼或魔豆,讓您的程式碼在雲端備份,提供恢復到以前的版本的能力,並且,對更為先進的專案創建一個程式碼分支來執行不同的功能,在完成之前把它們合併到一起。

02.檔案

  使用結構化的註釋區塊格式如YUIDoc或JsDoc到文件的功能,因此任何開發人員可以了解其目的,而不需要研究它的程式碼,這樣可以減少誤解。用Markdown語法可以有更豐富,長篇的評論和說明。使用關聯的命令列工具來自動產生一個文件的網站:基於這些結構性的意見,它和在您的程式碼所做的任何修改最新狀態一致。

03.往績分析

  定期對您的程式碼執行一個靜態程式碼分析工具,如JSHint或JSLint。這些對已知的編碼缺陷和潛在的錯誤進行的檢查,例如忘記使用嚴格模式或引用未聲明的變量,和缺少括號或分號。糾正任何問題的工具控件,以改善你的程式碼品質。嘗試為您的專案團隊設定預設選項,以加強編碼標準,例如由空格的縮排每一行,在哪裡放置花括號,並在整個程式碼檔案中使用單引號或雙引號的數目。

04.檢定

  一個單元測試是一小段獨立的功能執行的功能之一:執行其中一個來自你特定輸入的主程式碼庫的函數以確認它輸出一個預期值。為了提高您的信心,程式碼將像預期的那樣,編寫使用的框架,如Jasmine或QUnit為每個功能單元測試,使用預期和未預期的輸入參數。但千萬不要忘了那些邊緣的狀況!
  在跨多個作業系統多個瀏覽器上執行這些測試,透過利用這項服務,如BrowserStack或Sauce Labs,讓你可以加速需求中的在雲端上地虛擬機地測試。這兩個服務提供了一個API,讓你的單元測試能夠自動在多個瀏覽器同時運行,一旦它們完成,就會將結果回饋給你。作為紅利,如果你的程式碼儲存在GitHub上,你可以採取BrowserSwarm,這是一個當你提交你的程式碼會自動執行你的單元測試的工具。

05.測量

  程式碼覆蓋工具,如Istanbul測量當你的單元測試對你的函數運行時,哪些程式碼行數被執行,將它作為該程式碼行總數的百分比進行報告。對你的單元測試執行一個程式碼覆蓋工具,並增加額外的測試,可以增加你的覆蓋率得分至100%,給你對你的程式碼更大的信心。
函數的複雜性可以用霍爾斯特德複雜度量測來測量:計算機科學家莫里斯·霍爾斯特德在20世紀70年代設立的方程式,一個函數的複雜性的是根據循環,分支和它所包含的函數呼叫來量化的:函數的複雜度可以使用Halstead的複雜度措施來測量。當這種複雜的分數降低時,我們就越容易理解並維持這個函數,減少了出錯的可能性。命令列工具柏拉圖措施和JavaScript程式碼複雜性的產生的資料的視覺化,幫助確定可以改進的功能,同時儲存先前的結果,允許跟隨時間的推移追蹤品質的進步。

06.自動化

  使用Task runner例如Grunt來自動操作文件編制,分析,測試,覆蓋範圍和複雜性報告生成的過程,這樣就節省了您的時間和精力,並增加解決出現的任何質量問題的機會。大多數的這篇文章中所強調的工具和測試框架都和Grunt有關聯,這可以幫助您提高您的工作流程和程式碼品質並且不必動一根手指。

07.處理異常

  不約而同的是,在某些時候,你的程式碼將在它運行時出現一個錯誤。使用「try… Catch」語句來適當地處理運行時間的錯誤和限制您網站上的行為的影響。使用網路服務記錄執行時出現的錯誤。並使用這些資訊來添加新的單元測試,從而改進你的程式碼並一個一個地消滅這些錯誤。

通往成功的步驟

  這七個步驟,幫我創作 一些在我到目前為止的職業生涯裡我最自豪的程式碼。它們也是未來的一個很好的基礎。在您自己的專案裡,承諾使用這些步驟,生產出高品質的JavaScript程式碼,讓我們攜手共進,改善網絡,一步一步通往成功。

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn