JS反復可能オブジェクト

ES6 では、反復子と反復可能オブジェクトの概念が導入され、for...of ループ、Map (反復可能) コンストラクター、拡張構文などの反復可能オブジェクトの関連サポートが提供されます。配列の外側でのデータ収集のトラバーサル操作も大幅に簡素化しましょう。

反復可能なオブジェクト

配列は特別なオブジェクトであり、通常のオブジェクトとの違いは、要素の順次アクセスと格納だけではありません。もう 1 つの重要な違い: 配列は反復可能です。つまり、for ... ofステートメントを使用してすべての要素にアクセス (反復) できます。

通常のオブジェクト使用for ... ofステートメントではエラーが報告されます

let arr = [1,2,3,4,5]
for(let val of arr) {
    console.log(val)  // 1 2 3 4 5
}

let obj = {
    name:'Kite',
    age:23,
}
for(let key of obj) { // obj is not iterable
    console.log(key)
}

スプレッド演算子

// es5 apply
function consoleLog() {
  console.log(...arguments)
}
console.log(consoleLog.apply(null, array))

// es6 扩展预算符
const array = [1, 2, 3, 4]
console.log(...array); // 1,2,3,4


const obj = {
  name: 'kite',
  age: 23,
}
console.log(...obj); // TypeError: Found non-callable @@iterator

シンボル.イテレータ

オブジェクトを反復可能にしたい場合は、オブジェクトにSymbol.iteratorというSymbolメソッドを追加する必要があります。

ループを使用してfor ... ofオブジェクトを反復処理する場合、Symbol.iteratorイテレータ (メソッドを持つオブジェクト) を返すメソッドが呼び出されますnext()。
イテレータを取得した後、for ... of継続的にイテレータnext()メソッドを呼び出して次の要素を取得します。
next()メソッドによって返されるコンテンツは次の形式に準拠する必要があります。その時点で{done:Boolean,value:any}ループは終了します。それ以外の場合は次の値です。done:truevalue

反復子:

イテレータはC++他の言語から借用した概念です。イテレータの原理はポインタのようなものです。イテレータはデータコレクション内の要素を指します。それが指す要素を取得したり、それを移動して他の要素を取得したりすることもできます。イテレータは配列内の添え字の展開に似ており、リンクリスト ( List)、コレクション ( Set)、マップ ( Map) などのさまざまなデータ構造には対応するイテレータがあります。

JSの反復子は、この操作を実行するために特別に設計されています。毎回取得されるイテレータは常に最初の要素を指し、next()データセットの最後の要素が取得されるまでイテレータの動作は 1 つだけです。イテレータの位置を柔軟に移動することはできないため、イテレータのタスクは、データセット内の要素を特定の順序で走査することです。

反復可能なオブジェクトを実装します。

let obj = {
    name: 'Kite',
    age:23,
    [Symbol('id')]: 20000219
}
obj[Symbol.iterator] = function(){
    //返回一个迭代器
    return {
        index: 0,
        next: function () {
            const keys = Reflect.ownKeys(obj);
            if(this.index < keys.length - 1 ) {
                const key = keys[this.index];
                this.index++;
                return { done:false,value:obj[key] }
            } else {
                return { done:true, value: undefined }//迭代结束
            }
        }
    }
}
for(let value of obj){
    console.log(value)  // Kite 23 20000219
}
for(let key in obj){
  console.log(key)  // name age
}

反復可能なオブジェクトの概念:

いわゆる反復可能オブジェクトは、Symbol.iterator反復子を返すメソッドという名前のメソッドを持つ通常のオブジェクトです。Symbol.iteratorあるいは、両方のメソッドを持つオブジェクトnextも反復可能なオブジェクトです。

反復可能なオブジェクト

シンボル.イテレータ

おすすめ