javaScript中 for...in 和 for...of 的區(qū)別

alanoddsoff 發(fā)布于2019-08-22 18:42 / 2826人閱讀

摘要：和的差異解析是標準，是針對的不足而補充的方法。遍歷的是數(shù)組中元素的值。當使用遍歷數(shù)組的時候，我們得到的實際上是數(shù)組的索引值鍵值，同時如果數(shù)組存在別的屬性的話，也會被遍歷出來。甚至可以遍歷到對象的原型方法和屬性一個栗子參考簡述中與區(qū)別

for...in和for...of使用場景差異

一句話：遍歷對象的屬性時，用for...in。想遍歷數(shù)組中元素的值的話,用for...of。

for...in 和 for...of的差異解析

for...in是 ES5 標準，for...of是 ES6 針對for...in的不足而補充的方法。

for...in遍歷的是 "鍵名"。for...of遍歷的是數(shù)組中元素的值。

當使用for...in遍歷數(shù)組的時候，我們得到的實際上是數(shù)組的索引值(鍵值)，同時如果數(shù)組存在別的屬性的話，也會被遍歷出來。for...in甚至可以遍歷到對象的原型方法和屬性

一個栗子

Object.prototype.objCustom = function () {}; 
Array.prototype.arrCustom = function () {};

let iterable = [3, 5, 7];
iterable.foo = "hello";

for (let i in iterable) {
  console.log(i); //  0, 1, 2, "foo", "arrCustom", "objCustom"
}


for (let i of iterable) {
  console.log(i); // 3, 5, 7

參考

簡述js中 for in 與 for of 區(qū)別

云服務器 GPU云服務器 for...of php和javascript的區(qū)別 javascript和jquery的區(qū)別 jquery和javascript的區(qū)別

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/96113.html

Javascript數(shù)組的“字符串”索引 & for…in 和 for…of的區(qū)別

摘要：中的數(shù)組是沒有字符串索引的，形如只是在對象上添加了屬性。本來有幾個例子，然而搜到了的文檔，所以摘一點下面摘自循環(huán)會遍歷一個對象上面的所有屬性。語法是針對集合的，而不是所有的對象。它會遍歷定義了屬性的集合的所有元素。 TL;DR：js中的數(shù)組是沒有字符串索引的，形如array[b] = someValue只是在array對象上添加了屬性。本來有幾個例子，然而搜到了MDN的文檔，所以摘一...

mo0n1andin 2019-08-20 17:50 評論0 收藏0
JavaScript 的 4 種數(shù)組遍歷方法： for VS forEach() VS for/in

摘要：對于，除非使用箭頭函數(shù)，它的回調(diào)函數(shù)的將會變化。使用測試下面的代碼，結(jié)果如下打印打印要點使用的規(guī)則要求所有回調(diào)函數(shù)必須使用箭頭函數(shù)。譯者按： JS 騷操作。原文：For vs forEach() vs for/in vs for/of in JavaScript 譯者: Fundebug 本文采用意譯，版權(quán)歸原作者所有我們有多種方法來遍歷 JavaScript 的數(shù)組或者...

joyqi 2019-08-26 13:35 評論0 收藏0
JavaScript的幾種循環(huán)方式

摘要：本教程解釋了現(xiàn)代中各種各樣的循環(huán)可能性目錄介紹提供了許多迭代循環(huán)的方法。引入了循環(huán)，它結(jié)合了的簡潔性和破解能力注意使用。此循環(huán)在每次迭代中創(chuàng)建一個新范圍，因此我們可以安全地使用它而不是。 JavaScript提供了許多通過LOOPS迭代的方法。本教程解釋了現(xiàn)代JAVASCRIPT中各種各樣的循環(huán)可能性 showImg(https://segmentfault.com/img/bVbfH...

Allen 2019-08-29 16:28 評論0 收藏0
JavaScript的幾種循環(huán)方式

摘要：本教程解釋了現(xiàn)代中各種各樣的循環(huán)可能性目錄介紹提供了許多迭代循環(huán)的方法。引入了循環(huán)，它結(jié)合了的簡潔性和破解能力注意使用。此循環(huán)在每次迭代中創(chuàng)建一個新范圍，因此我們可以安全地使用它而不是。 JavaScript提供了許多通過LOOPS迭代的方法。本教程解釋了現(xiàn)代JAVASCRIPT中各種各樣的循環(huán)可能性 showImg(https://segmentfault.com/img/bVbfH...

piapia 2019-08-26 12:19 評論0 收藏0
JavaScript的幾種循環(huán)方式

摘要：本教程解釋了現(xiàn)代中各種各樣的循環(huán)可能性目錄介紹提供了許多迭代循環(huán)的方法。引入了循環(huán)，它結(jié)合了的簡潔性和破解能力注意使用。此循環(huán)在每次迭代中創(chuàng)建一個新范圍，因此我們可以安全地使用它而不是。 JavaScript提供了許多通過LOOPS迭代的方法。本教程解釋了現(xiàn)代JAVASCRIPT中各種各樣的循環(huán)可能性 showImg(https://segmentfault.com/img/bVbfH...

ztyzz 2019-08-02 11:20 評論0 收藏0