成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專(zhuān)欄INFORMATION COLUMN

我們不一樣:for...of與for...in

Imfan / 2449人閱讀

摘要:定義兩者都是遍歷的方法,最先能想到的區(qū)別是,前者是遍歷鍵名,后者是遍歷鍵值。一種數(shù)據(jù)結(jié)構(gòu)只要部署了接口,就稱(chēng)之為可遍歷的。中提供了一些具備原生接口的數(shù)據(jù)結(jié)構(gòu)包括函數(shù)的對(duì)象對(duì)象。

定義

兩者都是遍歷的方法,最先能想到的區(qū)別是,前者是遍歷鍵名,后者是遍歷鍵值。
看一下兩者的定義:

for...in 遍歷當(dāng)前對(duì)象的所有可枚舉屬性(包括自有屬性,從原型繼承的屬性),遍歷順序是無(wú)序的

for...of 遍歷當(dāng)前可遍歷(iterable)數(shù)據(jù)結(jié)構(gòu)擁有的可迭代元素(iterator),是有序的,是ES6提供的新方法

那么iterator是什么呢

遍歷器 iterator

iterator是一種接口,為不同的數(shù)據(jù)結(jié)構(gòu)提供統(tǒng)一的訪問(wèn)機(jī)制。
iterator主要供for...of消費(fèi)。
一種數(shù)據(jù)結(jié)構(gòu)只要部署了iterator接口,就稱(chēng)之為可遍歷的。
ES6中提供了一些具備原生iterator接口的數(shù)據(jù)結(jié)構(gòu)(包括Array、Map、Set、String、TypedArray、函數(shù)的arguments對(duì)象、NodeList對(duì)象。不包括Object),部署在數(shù)據(jù)結(jié)構(gòu)的Symbol.iterator屬性中。
所以也可以說(shuō),一種數(shù)據(jù)結(jié)構(gòu)只要有Symbol.iterator屬性,就稱(chēng)之為可遍歷的。

var myIterable = {};
myIterable[Symbol.iterator] = function* () {
    yield 1;
    yield 2;
    yield 3;
};

for (let value of myIterable) { 
    console.log(value); 
}
// 1
// 2
// 3
for...of使用示例
// 遍歷數(shù)組
let iterable = [10, 20, 30];
for (let value of iterable) {
  value += 1;
  console.log(value);
}
// 11
// 21
// 31

// 遍歷字符串
let iterable = "boo";

for (let value of iterable) {
  console.log(value);
}
// "b"
// "o"
// "o"

// 遍歷Map
let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
for (let entry of iterable) {
  console.log(entry);
}
// ["a", 1]
// ["b", 2]
// ["c", 3]
for (let [key, value] of iterable) {
  console.log(value);
}
// 1
// 2
// 3

// 遍歷arguments
(function() {
  for (let argument of arguments) {
    console.log(argument);
  }
})(1, 2, 3);
// 1
// 2
// 3

如果用中斷for...of,可以使用break、continue、throw或return

function* foo(){ 
  yield 1; 
  yield 2; 
  yield 3; 
}; 

for (let o of foo()) { 
  console.log(o); 
  break; // 終止iterator,跳出循環(huán)
}
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 in iterable) {
  if (iterable.hasOwnProperty(i)) {
    console.log(i); // 0, 1, 2, "foo"
  }
}

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

ECMAScript 6 入門(mén) - Iterator 和 for...of 循環(huán)
developer.mozilla.org - Difference between for...of and for...in

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

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/107696.html

相關(guān)文章

  • js遍歷之for forEach in of

    摘要:語(yǔ)法參數(shù)當(dāng)前遍歷項(xiàng)。遍歷的范圍在第一次調(diào)用前就會(huì)確定。已刪除的項(xiàng)不會(huì)被遍歷到。的是由提出的,目的是作為遍歷所有數(shù)據(jù)結(jié)構(gòu)的統(tǒng)一方法。不僅可以遍歷數(shù)組,還可以遍歷結(jié)構(gòu),某些類(lèi)似數(shù)組的對(duì)象如對(duì)象對(duì)象,對(duì)象,以及字符串。 即使是最簡(jiǎn)單的循環(huán),其中也深藏學(xué)問(wèn) ECMAScript5(es5)有三種for循環(huán) 簡(jiǎn)單for for in forEach ECMAScript6(es6)新增 fo...

    yeyan1996 評(píng)論0 收藏0
  • Iterator 和 for...of 循環(huán)

    摘要:和循環(huán)遍歷器意義為四種數(shù)據(jù)集合,提供統(tǒng)一的接口機(jī)制來(lái)處理所有不同的數(shù)據(jù)結(jié)構(gòu)。調(diào)用函數(shù)返回一個(gè)遍歷器對(duì)象,代表函數(shù)的內(nèi)部指針。以后,每次調(diào)用遍歷器對(duì)象的方法,就會(huì)返回一個(gè)有著和兩個(gè)屬性的對(duì)象。 Iterator 和 for...of 循環(huán) Iterator(遍歷器)意義 為Array、Object、Map、Set四種數(shù)據(jù)集合,提供統(tǒng)一的接口機(jī)制來(lái)處理所有不同的數(shù)據(jù)結(jié)構(gòu) 。 任何數(shù)據(jù)結(jié)構(gòu),...

    Drinkey 評(píng)論0 收藏0
  • 數(shù)組對(duì)象、字符串遍歷方法大全

    摘要:本文主要收集各種遍歷方法,主要針對(duì)數(shù)組,也會(huì)有關(guān)于對(duì)象字符串的,看完它,你會(huì)對(duì)遍歷有一個(gè)新的認(rèn)識(shí)。方法是標(biāo)準(zhǔn)引入的。 當(dāng)我們需要遍歷一個(gè)數(shù)組時(shí),第一個(gè)想到的就是for,然后用length去判斷條件,之后++,但著似乎有些過(guò)于老套了。本文主要收集各種遍歷方法,主要針對(duì)數(shù)組,也會(huì)有關(guān)于對(duì)象、字符串的,看完它,你會(huì)對(duì)遍歷有一個(gè)新的認(rèn)識(shí)。 showImg(https://segmentfaul...

    szysky 評(píng)論0 收藏0
  • lodash源碼分析之compact中的遍歷

    摘要:到這里,源碼分析完了。但是,有兩個(gè)致命的特性的遍歷不能保證順序會(huì)遍歷所有可枚舉屬性,包括繼承的屬性。的遍歷順序依賴(lài)于執(zhí)行環(huán)境,不同執(zhí)行環(huán)境的實(shí)現(xiàn)方式可能會(huì)不一樣。 小時(shí)候,鄉(xiāng)愁是一枚小小的郵票, 我在這頭, 母親在那頭。 長(zhǎng)大后,鄉(xiāng)愁是一張窄窄的船票, 我在這頭, 新娘在那頭。 后來(lái)啊, 鄉(xiāng)愁是一方矮矮的墳?zāi)梗?我在外頭, 母親在里頭。 而現(xiàn)在, 鄉(xiāng)愁是一灣淺淺的海峽, 我在這頭, 大...

    dmlllll 評(píng)論0 收藏0
  • javascript遍歷方法總結(jié)

    摘要:總之,是用來(lái)循環(huán)帶有字符串的對(duì)象的方法。循環(huán)里引入了一種新的循環(huán)方法,它就是循環(huán),它既比傳統(tǒng)的循環(huán)簡(jiǎn)潔,同時(shí)彌補(bǔ)了和循環(huán)的短板。 forEach 循環(huán) JavaScript誕生已經(jīng)有20多年了,我們一直使用的用來(lái)循環(huán)一個(gè)數(shù)組的方法是這樣的: for (var index = 0; index < myArray.length; index++) { console.log(myAr...

    BothEyes1993 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<