Q: オブジェクトをトラバースするために for of を使用できますか?

序文

この記事では、反復子パターンについて説明するための入門として、for を使用して Object を走査します。

イテレータパターンとは何ですか

Iterator パターンは、オブジェクトの内部表現を公開することなく、集合オブジェクトの個々の要素に順次アクセスする方法を提供します。——「デザインパターン: 再利用可能なオブジェクト指向ソフトウェアの基礎」

イテレータパターンはトラバーサルのために存在すると言えます。トラバーサルに関しては、誰もがこれらのメソッドに精通しているので、さまざまなデータ型のトラバーサルを簡単にリストしてみましょう。

トラバース配列

for ループ
それぞれに
地図
減らす
キー
価値観
の
……

のキー値にはイテレータのサポートが必要です。これについては後で紹介します。

トラバースマップ/セット

キー
エントリ
それぞれに
……

オブジェクトのトラバース

のために
まず、Object.keys(obj) を使用してオブジェクトの各属性の配列を取得し、次に配列トラバーサルメソッドを使用して各キーを走査し、各キーに対応する値を取得します。

Iterator および for of
Iterator は、さまざまなデータ構造に統一されたアクセスメカニズムを提供するために ES6 によって提案されたインターフェイスです。Iterator インターフェイスが任意のデータ構造にデプロイされている限り、トラバーサル操作を完了できます。

Iterator の機能は、
さまざまなデータ構造に統一されたシンプルなアクセスインターフェイスを提供することです。
ES6 は新しいトラバーサルコマンド for...of ループを提案しており、Iterator インターフェイスは主に for...of の消費に使用されます。
Iterator の走査プロセス
配列は for...of ループをサポートしているため、配列には Iterator インターフェイスがデプロイされている必要があります。これを使用して Iterator の走査プロセスを見てみましょう。

写真から次のことがわかります。

Iterator インターフェイスは、next メソッドを使用してオブジェクトを返します。
next が呼び出されるたびに、配列内の項目がデータ構造の終わりを指すまで順番に返されます。
返される結果は、現在の値 value と現在の完了が完了したかどうかを含むオブジェクトです。

オブジェクトをトラバースするには for of を使用します

タイトルの質問に戻りますが、for of を使用してオブジェクトをトラバース可能にするにはどうすればよいでしょうか?

上記によると、Iterator インターフェイスをオブジェクトにデプロイする必要があります (実際には、Symbol.iterator という名前の関数が Object.prototype に実装されています。この関数は、next メソッドでオブジェクトを返します。next が呼び出されるたびに、それが返されます)。連続して使用できます。データ構造の終わりを指すまで配列内の項目を返します)

function objectIterator() {
  const keys = Object.keys(this)
  let index = 0
  return {
    next: () => {
      const done = index >= keys.length
      const value = done ? undefined : this[keys[index]]
      index++
      return {
        done,
        value
      }
    }
  }
}

Object.prototype[Symbol.iterator] = objectIterator

const obj = {
  key: '1',
  value: '2'
}

for (const iterator of obj) {
  console.log(iterator)
}

画像.png