JavaScript執(zhí)行效率與性能提升方案
2024-05-06 14:20:24
供稿：網(wǎng)友
如何提升JavaScript執(zhí)行效率與性能在前端開(kāi)發(fā)中位于一個(gè)很重要的地方，這節(jié)來(lái)研究下如何在平時(shí)做項(xiàng)目過(guò)程中，提升JavaScript性能與運(yùn)行效率。
循環(huán)
循環(huán)是很常用的一個(gè)控制結(jié)構(gòu)，大部分東西要依靠它來(lái)完成，在JavaScript中，我們可以使用for(;;),while(),for(in)三種循環(huán)，事實(shí)上，這三種循環(huán)中for(in)的效率極差，因?yàn)樗枰樵兩⒘墟I，只要可以就應(yīng)該盡量少用。for(;;)和while循環(huán)的性能應(yīng)該說(shuō)基本（平時(shí)使用時(shí)）等價(jià)。
而事實(shí)上，如何使用這兩個(gè)循環(huán)，則有很大講究。最后得出的結(jié)論是：
如果是循環(huán)變量遞增或遞減，不要單獨(dú)對(duì)循環(huán)變量賦值，應(yīng)該在它最后一次讀取的時(shí)候使用嵌套的++或--操作符。如果要與數(shù)組的長(zhǎng)度作比較，應(yīng)該事先把數(shù)組的length屬性放入一個(gè)局部變量中，減少查詢次數(shù)。舉例，假設(shè)arr是一個(gè)數(shù)組，最佳的遍歷元素方式為：
代碼如下:
for(var i=0, len = arr.length;i
或者，如果無(wú)所謂順序的話：
代碼如下:
for(var i=arr.length;i>0;i--){...}
局部變量和全局變量
局部變量的速度要比全局變量的訪問(wèn)速度更快，因?yàn)槿肿兞科鋵?shí)是全局對(duì)象的成員，而局部變量是放在函數(shù)的棧當(dāng)中的。
不使用Eval
使用eval相當(dāng)于在運(yùn)行時(shí)再次調(diào)用解釋引擎對(duì)內(nèi)容進(jìn)行運(yùn)行，需要消耗大量時(shí)間。這時(shí)候使用JavaScript所支持的閉包可以實(shí)現(xiàn)函數(shù)模版（關(guān)于閉包的內(nèi)容請(qǐng)參考函數(shù)式編程的有關(guān)內(nèi)容）。
減少對(duì)象查找
因?yàn)镴avaScript的解釋性，所以a.b.c.d.e，需要進(jìn)行至少4次查詢操作，先檢查a再檢查a中的b，再檢查b中的c，如此往下。所以如果這樣的表達(dá)式重復(fù)出現(xiàn)，只要可能，應(yīng)該盡量少出現(xiàn)這樣的表達(dá)式，可以利用局部變量，把它放入一個(gè)臨時(shí)的地方進(jìn)行查詢。這一點(diǎn)可以和循環(huán)結(jié)合起來(lái)，因?yàn)槲覀兂３Ｒ鶕?jù)字符串、數(shù)組的長(zhǎng)度進(jìn)行循環(huán)，而通常這個(gè)長(zhǎng)度是不變的，比如每次查詢a.length，就要額外進(jìn)行一個(gè)操作，而預(yù)先把var len=a.length，則就少了一次查詢。
字符串連接
如果是追加字符串，最好使用s+=anotherStr操作，而不是要使用s=s+anotherStr。如果要連接多個(gè)字符串，應(yīng)該少使用+=，如 s+=a;s+=b;s+=c;應(yīng)該寫(xiě)成s+=a + b + c；而如果是收集字符串，比如多次對(duì)同一個(gè)字符串進(jìn)行+=操作的話，最好使用一個(gè)緩存。怎么用呢？使用JavaScript數(shù)組來(lái)收集，最后使用join方法連接起來(lái)，如下var buf = new Array();for(var i = 0; i < 100; i++){ buf.push(i.toString());}var all = buf.join("""");
類型轉(zhuǎn)換
類型轉(zhuǎn)換是大家常犯的錯(cuò)誤，因?yàn)镴avaScript是動(dòng)態(tài)類型語(yǔ)言，你不能指定變量的類型。
1.把數(shù)字轉(zhuǎn)換成字符串，應(yīng)用"""" + 1，雖然看起來(lái)比較丑一點(diǎn)，但事實(shí)上這個(gè)效率是最高的，性能上來(lái)說(shuō)：
