摘要:也就是說,遍歷器對象本質(zhì)上,就是一個(gè)指針對象。執(zhí)行這個(gè)函數(shù),就會返回一個(gè)遍歷器。一個(gè)對象如果要有可被循環(huán)調(diào)用的接口,就必須在的屬性上部署遍歷器生成方法原型鏈上的對象具有該方法也可。后面跟的是一個(gè)可遍歷的結(jié)構(gòu),它會調(diào)用該結(jié)構(gòu)的遍歷器接口。
ES6 Iterator筆記(摘抄至阮一峰的ECMAScript 6入門)
Iterator的遍歷過程創(chuàng)建一個(gè)指針對象,指向當(dāng)前數(shù)據(jù)結(jié)構(gòu)的起始位置。也就是說,遍歷器對象本質(zhì)上,就是一個(gè)指針對象。
第一次調(diào)用指針對象的next方法,可以將指針指向數(shù)據(jù)結(jié)構(gòu)的第一個(gè)成員。
第二次調(diào)用指針對象的next方法,指針就指向數(shù)據(jù)結(jié)構(gòu)的第二個(gè)成員。
不斷調(diào)用指針對象的next方法,直到它指向數(shù)據(jù)結(jié)構(gòu)的結(jié)束位置。
每一次調(diào)用next方法,都會返回?cái)?shù)據(jù)結(jié)構(gòu)的當(dāng)前成員信息。具體來說,就是返回一個(gè)包含value和 done兩個(gè)屬性的對象。其中,value屬性是當(dāng)前成員的值,done屬性是一個(gè)布爾值,表示遍歷是否結(jié)束。
數(shù)據(jù)結(jié)構(gòu)的默認(rèn)Iterator接口在ES6中,有些數(shù)據(jù)結(jié)構(gòu)原生具備Iterator接口(比如數(shù)組),即不用任何處理,就可以被for...of循環(huán)遍歷,有些就不行(比如對象)。原因在于,這些數(shù)據(jù)結(jié)構(gòu)原生部署了Symbol.iterator屬性,另外一些數(shù)據(jù)結(jié)構(gòu)沒有。凡是部署了Symbol.iterator屬性的數(shù)據(jù)結(jié)構(gòu),就稱為部署了遍歷器接口。調(diào)用這個(gè)接口,就會返回一個(gè)遍歷器對象。
Symbol.iterator屬性本身是一個(gè)函數(shù),就是當(dāng)前數(shù)據(jù)結(jié)構(gòu)默認(rèn)的遍歷器生成函數(shù)。執(zhí)行這個(gè)函數(shù),就會返回一個(gè)遍歷器。
一個(gè)對象(Object)如果要有可被for...of循環(huán)調(diào)用的Iterator接口,就必須在Symobol.iterator的屬性上部署遍歷器生成方法(原型鏈上的對象具有該方法也可)。
class RangeIterator { // 構(gòu)造方法 constructor (start, stop) { this.value = start this.stop = stop } // 返回Symbol對象的iterator屬性,這是一個(gè)預(yù)定好的、類型為Symbol的特殊值,所以要放在方括號內(nèi)。 [Symbol.iterator] () { return this } next () { var value = this.value if (value < this.stop) { this.value++ return { done: false, value: value } } return { done: true, value: undefined } } } function range (start, stop) { return new RangeIterator(start, stop) } for (var value of range(0, 3)) { console.log(value) }調(diào)用Iterator接口的場合
解析賦值
對數(shù)組和Set結(jié)構(gòu)進(jìn)行解構(gòu)賦值時(shí),會默認(rèn)調(diào)用Symbol.iterator方法。
擴(kuò)展運(yùn)算符
擴(kuò)展運(yùn)算符(...)也會調(diào)用默認(rèn)的iterator接口 只要某個(gè)數(shù)據(jù)結(jié)構(gòu)部署了iterator接口,就可以對它使用擴(kuò)展運(yùn)算符,將其轉(zhuǎn)為數(shù)組。
yield*
yield*后面跟的是一個(gè)可遍歷的結(jié)構(gòu),它會調(diào)用該結(jié)構(gòu)的遍歷器接口。
其他場合
由于數(shù)組的遍歷會調(diào)用遍歷器接口,所以任何接收數(shù)組作為參數(shù)的場合,其實(shí)都調(diào)用了遍歷器接口。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/84345.html
摘要:在開發(fā)大型的項(xiàng)目中,可能會使用到管理的模塊化工具。說道,學(xué)習(xí)過的同學(xué)會比較熟悉,是服務(wù)器模塊的規(guī)范,采用了這個(gè)規(guī)范??赡苁俏磥砟K化解決方案的首選。 本文章記錄本人在學(xué)習(xí) JavaScript 中理解到的一些東西,加深記憶和并且整理記錄下來,方便之后的復(fù)習(xí)。 在開發(fā)大型的web項(xiàng)目中,可能會使用到管理js的模塊化工具。但是在前端輪子漫天飛的時(shí)代。那一款js模塊化工具真正適合我...
摘要:但也可用于數(shù)組遍歷,返回的值是數(shù)組的索引,因?yàn)椋瑖?yán)格來說,數(shù)組也是一個(gè)對象,所對應(yīng)的屬性是每個(gè)值的索引。只遍歷對象自身的和繼承的可枚舉的屬性摘自阮一峰入門對象擴(kuò)展一章。為新增遍歷方法。 [1] const arr = [7, 8, 9]; const obj = { a: 4, b: 5, c: 6 }; [2] for (let v in arr){ console.l...
摘要:阮一峰老師開源作品。書上的示例代碼可以通過在線網(wǎng)站代碼調(diào)試工具調(diào)試。 阮一峰老師開源作品。 書上的示例代碼可以通過 在線網(wǎng)站代碼調(diào)試工具 JS Bin 調(diào)試。 作用域 作用域鏈 每個(gè)變量或函數(shù)通過執(zhí)行環(huán)境 (execution context) 定義了其有權(quán)訪問的其他數(shù)據(jù),決定了他們各自的行為; 全局執(zhí)行環(huán)境是最頂層的執(zhí)行環(huán)境,根據(jù)宿主環(huán)境的不同,表示全局執(zhí)行環(huán)境的對象也不同:在瀏覽...
摘要:可選到該位置前停止讀取數(shù)據(jù),默認(rèn)等于數(shù)組長度。找出第一個(gè)符合條件的數(shù)組元素,參數(shù)是一個(gè)回調(diào)函數(shù),所有數(shù)組元素依次執(zhí)行該回調(diào)函數(shù),直到找出第一個(gè)返回值為的元素,然后返回該元素。回調(diào)函數(shù)可以接受三個(gè)參數(shù),依次為當(dāng)前的值當(dāng)前的位置和原數(shù)組。 ECMAScript 5.1 中提供的數(shù)組方法 ECMA-262/5.1 規(guī)范 判斷是否是數(shù)組 Array.isArray ( arg ) // fal...
摘要:一團(tuán)隊(duì)組織網(wǎng)站說明騰訊團(tuán)隊(duì)騰訊前端團(tuán)隊(duì),代表作品,致力于前端技術(shù)的研究騰訊社交用戶體驗(yàn)設(shè)計(jì),簡稱,騰訊設(shè)計(jì)團(tuán)隊(duì)網(wǎng)站騰訊用戶研究與體驗(yàn)設(shè)計(jì)部百度前端研發(fā)部出品淘寶前端團(tuán)隊(duì)用技術(shù)為體驗(yàn)提供無限可能凹凸實(shí)驗(yàn)室京東用戶體驗(yàn)設(shè)計(jì)部出品奇舞團(tuán)奇虎旗下前 一、團(tuán)隊(duì)組織 網(wǎng)站 說明 騰訊 AlloyTeam 團(tuán)隊(duì) 騰訊Web前端團(tuán)隊(duì),代表作品WebQQ,致力于前端技術(shù)的研究 ISUX 騰...
閱讀 2577·2021-10-25 09:45
閱讀 1239·2021-10-14 09:43
閱讀 2297·2021-09-22 15:23
閱讀 1519·2021-09-22 14:58
閱讀 1934·2019-08-30 15:54
閱讀 3539·2019-08-30 13:00
閱讀 1354·2019-08-29 18:44
閱讀 1571·2019-08-29 16:59