|
這篇是Nicholas討論如果防止腳本失控的第二篇，主要討論了如何重構(gòu)嵌套循環(huán)、遞歸，以及那些在函數(shù)內(nèi)部同時(shí)執(zhí)行很多子操作的函數(shù)�；镜乃枷牒蜕弦还�(jié)trunk()那個(gè)例子一致，如果幾個(gè)操作沒有特定的執(zhí)行順序，而且互相不是依賴關(guān)系，我們就可以通過異步調(diào)用的方式加以執(zhí)行，不止可以減少執(zhí)行的次數(shù)，還可以防止腳本失控。本文還介紹了通過memoization技術(shù)取代遞歸的方法。
【原文標(biāo)題】Speed up your JavaScript, Part 2
【原文作者】Nicholas C. Zakas
以下是對(duì)原文的翻譯：
上周我在《too much happening in a loop》（譯文）這篇文章中介紹了JavaScript運(yùn)行時(shí)間過長的第一個(gè)原因。相似的情況有時(shí)也出現(xiàn)在函數(shù)的定義上，函數(shù)也可能因?yàn)槭褂貌划?dāng)而過載使用。通常情況是函數(shù)內(nèi)包含了過多的循環(huán)（不是在循環(huán)中執(zhí)行了過多的內(nèi)容），太多的遞歸，或者只不過是太多不相干但又要一起執(zhí)行的操作。
太多的循環(huán)經(jīng)常是以嵌套的形式出現(xiàn)，這種代碼會(huì)一直占用JavaScript引擎直至循環(huán)結(jié)束。這方面有一個(gè)非常著名的例子，就是使用冒泡算法排序。由于JavaScript有內(nèi)置的sort()方法，我們沒有必要使用這種方式進(jìn)行排序，但我們可以借助這個(gè)算法理解嵌套循環(huán)占用資源的癥結(jié)所在，從而避免類似情況的發(fā)生。下面是一個(gè)在JavaScript使用冒泡排序法的典型例子：
function bubbleSort(items) {
for (var i = items.length - 1; i >= 0; i--) {
for (var j = i; j >= 0; j--) {
if (items[j] < items[j - 1]) {
var temp = items[j];
items[j] = items[j - 1];
items[j - 1] = temp;
}
}
}
}
回憶一下你在學(xué)校學(xué)習(xí)的計(jì)算機(jī)知識(shí)，你可能記得冒泡排序法是效率最低的排序算法之一，原因是對(duì)于一個(gè)包含n個(gè)元素的數(shù)組，必須要進(jìn)行n的平方次的循環(huán)操作。如果數(shù)組中的元素?cái)?shù)非常大，那么這個(gè)操作會(huì)持續(xù)很長時(shí)間。內(nèi)循環(huán)的操作很簡單，只是負(fù)責(zé)比較和交換數(shù)值，導(dǎo)致問題的最大原因在于循環(huán)執(zhí)行的次數(shù)。這會(huì)導(dǎo)致瀏覽器運(yùn)行異常，潛在的直接結(jié)果就是那個(gè)腳本失控的警告對(duì)話框。
幾年前，Yahoo的研究員Julien Lecomte寫了一篇題為《Running CPU Intensive JavaScript Computations in a Web Browser》的文章，在這篇文章中作者闡述了如何將很大的javaScript操作分解成若干小部分。其中一個(gè)例子就是將冒泡排序法分解成多個(gè)步驟，每個(gè)步驟只遍歷一次數(shù)組。我對(duì)他的代碼做了改進(jìn)，但方法的思路還是一樣的：
function bubbleSort(array, onComplete) {
var pos = 0; (function() {
var j, value;
for (j = array.length; j > pos; j--) {
if (array[j] < array[j - 1]) {
value = data[j];
data[j] = data[j - 1];
data[j - 1] = value;
}
}
pos++;
if (pos < array.length) {
setTimeout(arguments.callee, 10);
} else {
onComplete();
}
})();
} 這個(gè)函數(shù)借助一個(gè)異步管理器來實(shí)現(xiàn)了冒泡算法，在每次遍歷數(shù)組以前暫停一下。onComplete()函數(shù)會(huì)在數(shù)組排序完成后觸發(fā)，提示用戶數(shù)據(jù)已經(jīng)準(zhǔn)備好。bubbleSort()函數(shù)使用了和chunk()函數(shù)一樣的基本技術(shù)（參考我的上一篇帖子），將行為包裝在一個(gè)匿名函數(shù)中，將 arguments.callee傳遞給setTimeout()以達(dá)到重復(fù)操作的目的，直至排序完成。如果你要將嵌套的循環(huán)拆解成若干個(gè)小步驟，以達(dá)到解放瀏覽器的目的，這個(gè)函數(shù)提供了不錯(cuò)的指導(dǎo)意見。
出處：七月佑安
責(zé)任編輯：bluehearts
上一頁 下一頁 提升JavaScript運(yùn)行速度之函數(shù)篇 [2]
◎進(jìn)入論壇網(wǎng)頁制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。
|
第 1 頁 提升JavaScript運(yùn)行速度之函數(shù)篇 [1]
第 2 頁 
