隨著瀏覽器性能提高，伴隨著新的HTML5的編程接口的穩(wěn)步采用，網(wǎng)頁(yè)上的JavaScript的音量在逐漸增加。然而，一個(gè)寫得不好的程序編碼卻擁有著打破整個(gè)網(wǎng)站，讓用戶為之沮喪和驅(qū)趕潛在客戶的潛力。
　　開(kāi)發(fā)人員必須使用所有供他們?nèi)我馐褂玫墓ぞ吆图夹g(shù)來(lái)提升他們的代碼的質(zhì)量，并有信心確認(rèn)每次的執(zhí)行都是可以預(yù)見(jiàn)的。這是一個(gè)在我心靈深處的話題并且我已經(jīng)工作多年找到一組開(kāi)發(fā)過(guò)程中來(lái)遵循的步驟以確保只有最高質(zhì)量的代碼可以被發(fā)布。
　　您只要按照這七個(gè)步驟操作就會(huì)大大提高您的JavaScript項(xiàng)目的質(zhì)量。使用這個(gè)工作流程，錯(cuò)誤將會(huì)減少并且將很多處理優(yōu)化，讓用戶擁有一個(gè)愉悅的上網(wǎng)瀏覽體驗(yàn)。

01.代碼

　　首先在你的函數(shù)里調(diào)用ECMAScript5的嚴(yán)格模式和一個(gè)“嚴(yán)格模式”的聲明，并使用該模塊的設(shè)計(jì)模式，在自執(zhí)行的函數(shù)閉包里，通過(guò)沙箱獨(dú)立的代碼模塊盡量減少全局變量?jī)?nèi)的使用，通過(guò)任何外部依賴關(guān)系以保持全局變量模塊清晰，簡(jiǎn)明。只有使用已建立好的，行之有效的，已通過(guò)測(cè)試并結(jié)果良好的第三方的函數(shù)庫(kù)和框架，并保持你的函數(shù)處于小值，從你的模組操作和其他視圖層代碼里分離出任何業(yè)務(wù)邏輯或數(shù)據(jù)。
　　有多個(gè)開(kāi)發(fā)人員的較大的項(xiàng)目應(yīng)該遵循一套既定的編碼原則，如谷歌的JavaScript的風(fēng)格指南，并需要更強(qiáng)的代碼管理規(guī)則，包括通過(guò)一個(gè)庫(kù)，如RequireJS，使用軟件包管理使用異步模塊定義(AMD)進(jìn)行嚴(yán)格的依賴關(guān)系管理，使用Bower或Jam(客戶端庫(kù)管理工具)的包裝管理來(lái)參考您的依賴項(xiàng)文件的特定版本，并采用結(jié)構(gòu)設(shè)計(jì)模式，如觀察者模式，以方便您不同的代碼模塊之間的松耦合通信。這也是一個(gè)明智的想法：使用一個(gè)代碼存儲(chǔ)庫(kù)系統(tǒng)體系，如Git或Subversion，通過(guò)一些服務(wù)如源代碼或魔豆，讓您的代碼在云端備份，提供恢復(fù)到以前的版本的能力，并且，對(duì)更為先進(jìn)的項(xiàng)目創(chuàng)建一個(gè)代碼分支來(lái)執(zhí)行不同的功能，在完成之前把它們合并到一起。

02.文件

　　使用結(jié)構(gòu)化的注釋區(qū)塊格式如YUIDoc或JsDoc到文件的功能，因此任何開(kāi)發(fā)人員可以了解其目的，而不需要研究它的代碼，這樣可以減少誤解。用Markdown語(yǔ)法可以有更豐富，長(zhǎng)篇的評(píng)論和說(shuō)明。使用關(guān)聯(lián)的命令行工具來(lái)自動(dòng)生成一個(gè)文檔的網(wǎng)站：基于這些結(jié)構(gòu)性的意見(jiàn),它和在您的代碼所做的任何修改最新?tīng)顟B(tài)一致。

03.往績(jī)分析

　　定期對(duì)您的代碼運(yùn)行一個(gè)靜態(tài)代碼分析工具，如JSHint或JSLint。這些對(duì)已知的編碼缺陷和潛在的錯(cuò)誤進(jìn)行的檢查，比如忘記使用嚴(yán)格模式或引用未聲明的變量，和缺少括號(hào)或分號(hào)。糾正任何問(wèn)題的工具控件，以改善你的代碼質(zhì)量。嘗試為您的項(xiàng)目團(tuán)隊(duì)設(shè)置默認(rèn)選項(xiàng)，以加強(qiáng)編碼標(biāo)準(zhǔn)，如由空格的縮進(jìn)每一行，在哪里放置花括號(hào)，并在整個(gè)代碼文件中使用單引號(hào)或雙引號(hào)的數(shù)目。

04.測(cè)試

　　一個(gè)單元測(cè)試是一小段獨(dú)立的功能執(zhí)行的功能之一：執(zhí)行其中一個(gè)來(lái)自你特定輸入的主代碼庫(kù)的函數(shù)以確認(rèn)它輸出一個(gè)預(yù)期值。為了提高您的信心，代碼將像預(yù)期的那樣，編寫使用的框架，如Jasmine或QUnit為每個(gè)功能單元測(cè)試，使用預(yù)期和未預(yù)期的輸入?yún)?shù)。但是千萬(wàn)不要忘了那些邊緣的情況!
　　在跨多個(gè)操作系統(tǒng)多個(gè)瀏覽器上運(yùn)行這些測(cè)試，通過(guò)利用這項(xiàng)服務(wù)，如BrowserStack或Sauce Labs，讓你可以加速需求中的在云端上地虛擬機(jī)地測(cè)試。這兩個(gè)服務(wù)提供了一個(gè)API，允許你的單元測(cè)試能夠自動(dòng)在多個(gè)瀏覽器同時(shí)運(yùn)行，一旦它們完成，就會(huì)將結(jié)果反饋給你。作為紅利，如果你的代碼存儲(chǔ)在GitHub上，你可以采取BrowserSwarm，這是一個(gè)當(dāng)你提交你的代碼會(huì)自動(dòng)運(yùn)行你的單元測(cè)試的工具。

05.測(cè)量

　　代碼覆蓋工具，如Istanbul測(cè)量當(dāng)你的單元測(cè)試對(duì)你的函數(shù)運(yùn)行時(shí)，哪些代碼行數(shù)被執(zhí)行，將它作為該代碼行總數(shù)的百分比進(jìn)行報(bào)告。對(duì)你的單元測(cè)試運(yùn)行一個(gè)代碼覆蓋工具，并增加額外的測(cè)試，可以增加你的覆蓋率得分至100%，給你對(duì)你的代碼更大的信心。
　　函數(shù)的復(fù)雜性可以用霍爾斯特德復(fù)雜度量測(cè)來(lái)測(cè)量：計(jì)算機(jī)科學(xué)家莫里斯·霍爾斯特德在20世紀(jì)70年代設(shè)立的方程式，一個(gè)函數(shù)的復(fù)雜性的是根據(jù)循環(huán)，分支和它所包含的函數(shù)調(diào)用來(lái)量化的：函數(shù)的復(fù)雜性可以使用Halstead的復(fù)雜性措施進(jìn)行測(cè)量。當(dāng)這種復(fù)雜的分?jǐn)?shù)降低時(shí)，我們就越容易理解和保持這個(gè)函數(shù)，減少了出錯(cuò)的可能性。命令行工具柏拉圖措施和JavaScript代碼復(fù)雜性的生成的數(shù)據(jù)的可視化，幫助確定可以改進(jìn)的功能，同時(shí)存儲(chǔ)以前的結(jié)果，允許跟隨著時(shí)間的推移跟蹤質(zhì)量的進(jìn)步。

06.自動(dòng)化

　　使用Task runner例如Grunt來(lái)自動(dòng)操作文件編制，分析，測(cè)試，覆蓋范圍和復(fù)雜性報(bào)告生成的過(guò)程，這樣就節(jié)省了您的時(shí)間和精力，并增加解決出現(xiàn)的任何質(zhì)量問(wèn)題的機(jī)會(huì)。大多數(shù)的這篇文章中所強(qiáng)調(diào)的工具和測(cè)試框架都和Grunt有關(guān)聯(lián)，這可以幫助您提高您的工作流程和代碼質(zhì)量并且不必動(dòng)一根手指。

07.處理異常

　　不約而同的是，在某些時(shí)候，你的代碼將在它運(yùn)行時(shí)出現(xiàn)一個(gè)錯(cuò)誤。使用“try… Catch”語(yǔ)句來(lái)適當(dāng)?shù)靥幚磉\(yùn)行時(shí)間的錯(cuò)誤和限制您網(wǎng)站上的行為的影響。使用網(wǎng)絡(luò)服務(wù)記錄運(yùn)行時(shí)出現(xiàn)的錯(cuò)誤。并使用此信息來(lái)添加新的單元測(cè)試，從而改進(jìn)你的代碼并一個(gè)一個(gè)地消滅這些錯(cuò)誤。

通向成功的步驟

　　這七個(gè)步驟，幫我創(chuàng)作 一些在我到目前為止的職業(yè)生涯里我最自豪的代碼。它們也是未來(lái)的一個(gè)很好的基礎(chǔ)。在您自己的項(xiàng)目里，承諾使用這些步驟，生產(chǎn)出高品質(zhì)的JavaScript代碼，讓我們攜手共進(jìn)，改善網(wǎng)絡(luò)，一步一步通向成功。

最新評(píng)論