摘要:語法參數當前遍歷項。遍歷的范圍在第一次調用前就會確定。已刪除的項不會被遍歷到。的是由提出的,目的是作為遍歷所有數據結構的統一方法。不僅可以遍歷數組,還可以遍歷結構,某些類似數組的對象如對象對象,對象,以及字符串。
即使是最簡單的循環,其中也深藏學問
ECMAScript5(es5)有三種for循環
簡單for
for in
forEach
ECMAScript6(es6)新增
for of
簡單forfor是循環的基礎語法,也是最常用的循環結構。沒有兼容性問題,效率上:for > forEach > map >for in
forEachforEach由es5提出,屬于數組的迭代方法
概述: 方法讓數組的每一項都執行一次給定的函數。
語法: array.forEach(callback[currentValue,index,array,thisArg]);
參數:
currentValue:當前遍歷項。
index:當前項目的下標
array:當前數組本身
thisArg:修改內部值的指向。
特點:
forEach 方法為數組中含有有效值的每一項執行一次 callback 函數,那些已刪除(使用 delete 方法等情況)或者從未賦值的項將被跳過(不包括那些值為 undefined 或 null 的項)。 forEach 遍歷的范圍在第一次調用 callback 前就會確定。調用forEach 后添加到數組中的項不會被 callback 訪問到。如果已經存在的值被改變,則傳遞給 callback 的值是 forEach 遍歷到他們那一刻的值。已刪除的項不會被遍歷到。
優點:
foreach會跳過數組中的空位 相對簡單for來說更語義化
缺點:
不能中斷循環,也不支持 continue 和 break,只能通過 return 來控制循環,但是不能退出循環本身。
兼容性: 只支持IE9及以上
性能: forEach 的速度不如 for
此循環有一個特殊的用途:可以枚舉任何對象的命名屬性。實際上它是為循環”enumerable“對象而設計的。
需要注意的是,for-in 循環遍歷的是對象的屬性,而不是數組的索引。由于對象的屬性沒有順序,for in循環輸出的輸出的屬性名也是不可預測的
性能:
由于每次迭代操作要搜索實例或原型屬性, for-in 循環的每次迭代都會產生更多開銷,因此執行速度比其他循環類型慢。在同樣的循環迭代操作中,其它類型循環速度要比它快7倍之多。除非對數目不詳的對象屬性進行操作,否則我們不推薦使用for in 循環。
Array 的真相 Array 在 Javascript 中是一個對象, Array 的索引是屬性名。事實上, Javascript 中的 “array” 有些誤導性, Javascript 中的 Array 并不像大部分其他語言的數組。首先, Javascript 中的 Array 在內存上并不連續,其次, Array 的索引并不是指偏移量。實際上, Array 的索引也不是 Number 類型,而是 String 類型的。我們可以正確使用如 arr[0] 的寫法的原因是語言可以自動將 Number 類型的 0 轉換成 String 類型的 "0" 。所以,在 Javascript 中從來就沒有 Array 的索引,而只有類似 "0" 、 "1" 等等的屬性。有趣的是,每個 Array 對象都有一個 length 的屬性,導致其表現地更像其他語言的數組。但為什么在遍歷 Array 對象的時候沒有輸出 length 這一條屬性呢?那是因為 for-in 只能遍歷“可枚舉的屬性”, length 屬于不可枚舉屬性,實際上, Array 對象還有許多其他不可枚舉的屬性。es6的for of
for of是由es6提出的,目的是作為遍歷所有數據結構的統一方法。
我們先來回顧一下此前js的遍歷方法:
foreach是為便利數組而設計的,不能正確響應break、continue和return語句
for in被設計用來枚舉對象的屬性的,遍歷對象的屬性
for in用在數組上,除了遍歷數組元素以外,還會遍歷自定義屬性,甚至原型鏈上的屬性,另外,遍歷順序是隨機的
那么for of 有什么不一樣呢?
特點:
語法同for in一樣簡潔,但避開了for in的缺陷
能正確響應break、continue和return語句
跟for in不一樣,數組的遍歷器接口只返回具有數字索引的屬性
for in讀取的是對象的鍵名,for of讀取的是鍵值
提供遍歷所有數據結構的統一方法。for of不僅可以遍歷數組,還可以遍歷Set、Map結構,某些類似數組的對象(如:argument對象、DOM NodeList對象),Generator對象,以及字符串。
如: let arr = ["a" ,"b", "c", "d"]; let itr = arr[Symbol.iterator]; arr.forEach(function(val, index, arr){ console.log(val); // a b c d console.log(index); // 0 1 2 3 }); for(let i of itr){ console.log(i); // a b c d } for(let i of arr){ console.log(i); // a b c d } for(let i in arr){ console.log(i); // 0 1 2 3 }
只要具有Iterator接口的數據結構,都可以使用for of循環遍歷它的成員。關于Iterator,如果還不清楚的可以先去了解一下,這里就不贅述了。這里需要注意一下,由于for of讀取的是鍵值,如果想通過for of獲取鍵名,可以借助數組實例的entries和keys方法。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/83742.html
摘要:下面就總結下中常見的幾種循環方法。因為循環將遍歷對象本身的所有可枚舉屬性,以及對象從其構造函數原型中繼承的屬性。上也明確提示不應該用于迭代一個,其中索引順序很重要。 引言 平時工作中循環的使用場景可以說是非常之多了,昨天改別人代碼時候有位同事非常喜歡用ES6等新特性,一個數組的遍歷全部都是用for...of...,然后業務需求要用到數組中的序號index值,就很尷尬了,我只能改回for...
摘要:從數組索引為開始刪除元素,直到對數組元素運用指定方法為為止。對兩個數組的元素分別調用指定方法后,返回以運行結果為判定基準的并集,并集是原始數組元素的并集而不是運行結果的并集。 原文地址:JavaScript30秒, 從入門到放棄之Array(六)博客地址:JavaScript30秒, 從入門到放棄之Array(六) 水平有限,歡迎批評指正 tail Returns all elem...
摘要:使用遍歷數組有三點問題遍歷順序不固定引擎不保證對象的遍歷順序。作為原生函數,和自身操作字符串的速度是很快的。由于沒有返回值返回,所以它的回調函數通常是包含副作用的,否則這個寫了毫無意義。接受一個回調函數,你可以提前,相當于手寫循環中的。 不要用 for_in 遍歷數組 這是 JavaScript 初學者常見的誤區。for_in 用于遍歷對象中包括原型鏈上的所有可枚舉的(enumerab...
摘要:有返回值,返回一個符合條件的元素數組返回一個,判斷是否有元素符合條件,如果有一個元素符合條件,則循環會終止。返回一個遍歷器對象,用來遍歷鍵名鍵值組成的數組。這三個方法調用后生成的遍歷器對象,所遍歷的都是計算生成的數據結構。 1.map 有返回值,返回一個新的數組,每個元素為調用func的結果。 let list = [1, 2, 3, 4, 5]; let other = list.m...
摘要:對于,除非使用箭頭函數,它的回調函數的將會變化。使用測試下面的代碼,結果如下打印打印要點使用的規則要求所有回調函數必須使用箭頭函數。 譯者按: JS 騷操作。 原文:For vs forEach() vs for/in vs for/of in JavaScript 譯者: Fundebug 本文采用意譯,版權歸原作者所有 我們有多種方法來遍歷 JavaScript 的數組或者...
閱讀 1312·2021-11-11 10:57
閱讀 3728·2021-09-07 10:10
閱讀 3449·2021-08-03 14:03
閱讀 3075·2019-08-30 13:45
閱讀 689·2019-08-29 11:19
閱讀 1047·2019-08-28 18:07
閱讀 3105·2019-08-26 13:55
閱讀 816·2019-08-26 12:17