細說 Javascript 數組篇（一） : 數組的遍歷和 length 屬性

TigerChain 發布于2019-08-21 12:17 / 3143人閱讀

摘要：遍歷為了達到最佳性能來遍歷一個數組，最好的方式就是使用經典的循環。盡管屬性是定義在數組本身的，但是在循環的每一次遍歷時仍然會有開銷。給屬性賦值一個更小的數將會截斷數組，如果賦值一個更大的數則不會截斷數組。

盡管數組在 Javascript 中是對象，但是不建議使用 for in 循環來遍歷數組，實際上，有很多理由來阻止我們對數組使用 for in 循環。
因為 for in 循環將會枚舉原型鏈上的所有屬性，并且唯一阻止的方法是使用 hasOwnProperty 來判斷，這將比普通的 for 循環要慢不少。

遍歷

為了達到最佳性能來遍歷一個數組，最好的方式就是使用經典的 for 循環。

var list = [1, 2, 3, 4, 5, ...... 100000000];
for(var i = 0, l = list.length; i < l; i++) {
    console.log(list[i]);
}

這兒有一個額外的技巧，就是通過 l = list.length 來緩存數組的長度。
盡管屬性 length 是定義在數組本身的，但是在循環的每一次遍歷時仍然會有開銷。盡管最新的 Javascript 引擎可能已經對這種情況作了性能上的優化，但是你并不能保證你的 Javascript 代碼會一直在這種瀏覽器上運行。
實際上，不緩存長度的循環要比緩存長度的循環性能上慢不少。

length 屬性

盡管 length 屬性僅僅通過 getter 方法返回數組中元素的個數，但是可以通過 setter 方法來截斷數組。

var foo = [1, 2, 3, 4, 5, 6];
foo.length = 3;
foo; // [1, 2, 3]

foo.length = 6;
foo.push(4);
foo; // [1, 2, 3, undefined, undefined, undefined, 4]

給 length 屬性賦值一個更小的數將會截斷數組，如果賦值一個更大的數則不會截斷數組。

總結

為了性能達到最優，建議使用 for 循環而不是使用 for in 循環，同時緩存 length 屬性。

參考

http://bonsaiden.github.io/JavaScript-Garden/#array.general

GPU云服務器云服務器 javascript中的二維數組數組遍歷遍歷數組遍歷篩選數組

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/87538.html

細說 Javascript 對象篇（四） : for in 循環

摘要：第二是，由于會遍歷整個原型鏈，所以當原型鏈過長時，會對性能造成影響。總結建議養成過濾屬性的好習慣，不要對運行環境做任何假設，也無論原生的原型對象是否被擴展。如同 in 運算符一樣，使用 for in 循環遍歷對象屬性時，也將往上遍歷整個原型鏈。 // Poisoning Object.prototype Object.prototype.bar = 1; var foo = {m...

Kross 2019-08-19 14:39 評論0 收藏0
細說 Javascript 函數篇（四） : ?arguments 對象

因為最近有博友反饋我的博文是直接翻譯的參考鏈接內的內容，所以我在這里要說明一下，以免引起不必要的誤會。首先，我很喜歡 segmentfault 的交流和學習的氛圍，所以我很愿意在這里跟各位 SFer 交流學習心得，相互學習，共同進步。第二，我做技術方面的工作不久，所以學習經歷也不是很長，但是我發現寫博客，總結自己的學習心得是個很好的學習習慣，至少對于我個人而言，我于此收益頗豐，所以我決定堅持一...

aristark 2019-08-21 12:15 評論0 收藏0
細說 Javascript 數組篇（二） : 數組的構造函數和常見操作

摘要：數組的構造函數由于數組的構造函數在處理參數時的不確定性，因此強烈建議使用符號來創建一個新數組。總結綜上所述，我們應該盡量使用來創建新函數，而不是數組的構造函數，這樣代碼將有更好的可讀性。數組的構造函數由于數組的構造函數在處理參數時的不確定性，因此強烈建議使用 [] 符號來創建一個新數組。 [1, 2, 3]; // Result: [1, 2, 3] new Array(1, ...

kaka 2019-08-19 14:45 評論0 收藏0
細說數組常用遍歷的方法

摘要：需要返回值，如果不給，默認返回使用場景假定有一個數值數組將數組中的值以雙倍的形式放到數組寫法方法使用場景假定有一個對象數組將數中對象某個屬性的值存儲到數組中三從數組中找出所有符合指定條件的元素檢測數值元素，并返回符合條件所有元素的數組。 showImg(https://segmentfault.com/img/remote/1460000016810336?w=1149&h=524);...

阿羅 2019-08-29 17:05 評論0 收藏0
細說數組常用遍歷的方法

摘要：需要返回值，如果不給，默認返回使用場景假定有一個數值數組將數組中的值以雙倍的形式放到數組寫法方法使用場景假定有一個對象數組將數中對象某個屬性的值存儲到數組中三從數組中找出所有符合指定條件的元素檢測數值元素，并返回符合條件所有元素的數組。 showImg(https://segmentfault.com/img/remote/1460000016810336?w=1149&h=524);...

AlphaWatch 2019-08-02 11:48 評論0 收藏0