高效率JavaScript編寫技巧整理

來源:互聯網
上載者:User

最近在編寫一個JavaScript架構,發現有很多細節注意得不夠,擔心長時間積累會導致架構實際應用的時候出現嚴重的效率問題。於是開始關注JavaScript提高效率的一些技巧,在這裡分享給大家。

1.JavaScript是唯一一個對代碼體積要求越小越好的語言,因此我們可以通過一些工具來精簡和壓縮JavaScript代碼,如JSMin、Packer、YUICompressor等。這些工具會將局部變數的名字替換成很短的變數名,例如將parseFloat()替換成a()。因此我們在編寫JavaScript代碼時,應將每一個全域變數都映射到一個局部變數,如var parseFloat = parseFloat;

2.通過JSLint來檢測你編寫的JavaScript,可以發現裡面隱藏的很多問題。JSLint是一個JavaScript驗證工具(非開源),可以掃描JavaScript原始碼來尋找問題。如果JSLint發現一 個問題,JSLint就會顯示描述這個問題的訊息,並指出錯誤在原始碼中的一般位置。

3.我們在寫JavaScript的時候經常需要遍曆一個數組,代碼如下:
複製代碼 代碼如下:
for (var i=0;i<array.length;i++){
//do something
}

JavaScript的成員變數是運行時確定的,這就導致每一次迴圈都需要尋找數組length屬性,因此我們可以增加一個變數來儲存數組大小:
複製代碼 代碼如下:
var l = array.length;
for (var i=0;i<l;i++){
//do something
}

這樣看起來已經最佳化得不錯了,但實際上我們可以做得更好:
複製代碼 代碼如下:
var i=array.length;
while(i--){
//do something
}

這是因為這兩行代碼轉換成彙編時,while語句所需的指令更少,在這裡就不展開說明了,大家有興趣可以去研究下彙編。

4.由於JavaScript中任何人都可以修改或添加Object.prototype中的屬性,因此我們在遍曆一個對象的屬性時,應先使用hasOwnProperty進行判斷,避免遍曆整個原型鏈,影響效率。如:
複製代碼 代碼如下:
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
//do something
}
}

5.在使用undefined的時候先定義一個局部變數undefined
複製代碼 代碼如下:
var checkVal = function(val) {
var undefined;
return val !== undefined;
};

上述代碼中,如果沒有提前定義局部變數,直接使用全域變數undefined進行判斷,如果第三方在別的地方定義了一個全域變數undefined=3將導致結果錯誤。

6.在將一個非字串類型的變數轉換成字串類型時,可以直接使用
複製代碼 代碼如下:
var str = (i + "").replace(...);

這個地方如果使用String(i)會慢很多。

7.定義數組的時候如果不需要使用數組類的排序等方法,只是進行一般的賦值和訪問,應該直接寫
複製代碼 代碼如下:
var array = {};

而不是
複製代碼 代碼如下:
var array = new Array();

否則這就和定義一個數字變數時寫var i = new Number(1)一樣沒有意義

8.使用jQuery時,對同一個對象執行多個函數盡量放在同一行代碼裡,例如:
複製代碼 代碼如下:
$("p.neat").addClass("ohmy").show("slow");

而不是
複製代碼 代碼如下:
$("p.neat").addClass("ohmy");
$("p.neat").show("slow");

其餘的技巧還有使用DocumentFragment最佳化多次append,使用firstChild和nextSibling代替childNodes遍曆dom元素等。
具體大家可以參考這篇部落格:http://www.nowamagic.net/librarys/veda/detail/363
本文還參考了這篇文章:http://www.cnblogs.com/justinw/archive/2009/12/07/1618500.html

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.