10個你需要了解的最佳javascript開發(fā)實踐
Javascript 的很多擴展的特性是的它變得更加的犀利, 同時也給予程序員機會創(chuàng)建更漂亮并且更讓用戶喜歡的網(wǎng)站。
盡管很多的開發(fā)人員都樂于頌揚 javascript,但是仍舊有人看到它的陰暗面。
使用很多 javascript 代碼的 web 頁面會加載很慢,過多的使用 javascript 使得網(wǎng)頁丑陋和拖沓。很快如何有效地使用 javascript 成為一個非?;馃岬脑掝}。
這里讓我們列出 10 個*** javascript 實踐,幫助你有效地使用 javascript。
1. 盡可能的保持代碼簡潔
可能大家都聽到過了N遍這個代碼簡潔問題了。作為一個開發(fā)人員你可能在你的代碼開發(fā)過程中使用了很多次,但千萬不要在 js 開發(fā)中忘記這點。
- 盡量在開發(fā)模式中添加注釋和空格,這樣保持代碼的可讀性
- 在發(fā)布到產(chǎn)品環(huán)境前請將空格和注釋都刪除,并且盡量縮寫變量和方法名
- 使用第三方工具幫助你實現(xiàn)壓縮 javascript。
2. 思考后再修改 prototypes
添加新的屬性到對象 prototype 中是導(dǎo)致腳本出錯的常見原因。
- yourObject.prototype.anotherFunction = ‘Hello’;
- yourObject.prototype.anotherMethod = function () { … };
在上面代碼中,所有的變量都會被影響,因為他們都繼承于 yourObject。這樣的使用會導(dǎo)致意想不到的行為。所以建議在使用完后刪除類似的修改。
- yourObject.prototype.anotherFunction = ‘Hello’;
- yourObject.prototype.anotherMethod = function () { … };
- test.anotherMethod();
- delete yourObject.prototype.anotherFunction = ‘Hello’;
- delete yourObject.prototype.anotherMethod = function () { … };
3. Debug Javascript 代碼
即使***的開發(fā)人員都會犯錯。為了***化的減少類似錯誤,請在你的 debugger 中運行你的代碼,確認(rèn)你沒有遇到任何細微的錯誤
4. 避免 Eval
你的 JS 在沒有 eval 方法的時候也可以很好的工作。eval 允許訪問 javascript 編譯器。如果一個字符串作為參數(shù)傳遞到 eval,那么它的結(jié)果可以被執(zhí)行。
這會很大的降低代碼的性能。盡量避免在產(chǎn)品環(huán)境中使用 eval。
5. 最小化 DOM 訪問
DOM 是最復(fù)雜的 API,會使得代碼執(zhí)行過程變慢。有時候 web 頁面可能沒有加載或者加載不完整。***避免 DOM。
6. 在使用 javascript 類庫之前先學(xué)習(xí) javascript
互聯(lián)網(wǎng)充斥著很多的 javascript 類庫,很多程序員都往往使用 js 類庫而不理解負面影響。強烈建議你在使用第三方類庫之前學(xué)習(xí)基本的 JS 代碼,否則,你就準(zhǔn)備著倒霉吧。
7. 不要用 "SetTimeOut" 和 "Setinterval" 方法來作為 "Eval" 的備選
- setTimeOut( "document.getID('value')", 3000);
在以上代碼中 document.getID('value') 在 setTimeOut 方法中被作為字符串來處理。 這類似于 eval 方法,在每個代碼執(zhí)行中來執(zhí)行一個字符串,因此會降低性能,因此,建議在這些方法中傳遞一個方法。
- setTimeOut(yourFunction, 3000);
8. [] 比 new Array(); 更好
一個常犯的錯誤在于使用當(dāng)需要數(shù)組的時候使用一個對象或者該使用對象的時候使用一個數(shù)組。但是使用原則很簡單:
“當(dāng)屬性名稱是小的連續(xù)整數(shù),你應(yīng)該使用數(shù)組。否則,使用一個對象” - Douglas Crockford, JavaScript: Good Parts 的作者.
建議:
- var a = ['1A','2B'];
避免:
- var a = new Array();
- a[0] = "1A";
- a[1] = "2B";
9. 盡量不要多次使用 var
在初始每一個變量的時候,程序員都習(xí)慣使用 var 關(guān)鍵字。相反,建議你使用逗號來避免多余的關(guān)鍵字,并且減少代碼體積。 如下:
- var variableOne = ‘string 1’,
- variableTwo = ‘string 2’,
- variableThree = ‘string 3’;
10. 不要忽略分號 ";"
這往往是大家花費數(shù)個小時進行 debug 的原因之一。
我很確信你肯定也在其它的文章中閱讀過以上相關(guān)的內(nèi)容,但是大家可能往往都忽略了很多基本的規(guī)則。 你是不是也曾經(jīng)忽略過分號。是不是也遇到過 eval 關(guān)鍵字問題導(dǎo)致性能問題?
希望大家能夠喜歡,謝謝!