Detaillierte Erläuterung des iterierbaren ES6-Protokolls und des Iteratorprotokolls

In diesem Artikel werden hauptsächlich das iterierbare Protokoll und das Iteratorprotokoll der ES6-Syntax ausführlich vorgestellt. Der Herausgeber findet es recht gut, daher werde ich es jetzt mit Ihnen teilen und als Referenz verwenden. Folgen wir dem Herausgeber und schauen wir uns das an. Ich hoffe, es kann allen helfen.

Mehrere Ergänzungen zu ECMAScript 2015 sind keine neuen integrierten Funktionen oder Syntax, sondern Protokolle. Diese Protokolle können von jedem Objekt implementiert werden, das bestimmten Konventionen folgt.
Es gibt zwei Protokolle: das iterierbare Protokoll und das Iteratorprotokoll.

Iterierbares Protokoll

Das iterierbare Protokoll ermöglicht es JavaScript-Objekten, ihr Iterationsverhalten zu definieren oder anzupassen, beispielsweise in einem for What Werte in der .of-Struktur können in einer Schleife verarbeitet (abgerufen) werden. Einige integrierte Typen sind integrierte iterierbare Objekte und verfügen über ein Standarditerationsverhalten, z. B. Array oder Map, während andere Typen dies nicht haben (z. B. Object).

Der Zweck der Iterator-Schnittstelle besteht darin, einen einheitlichen Zugriffsmechanismus für alle Datenstrukturen bereitzustellen, d. h. eine for...of-Schleife (Einzelheiten siehe unten). Wenn Sie eine for...of-Schleife zum Durchlaufen einer bestimmten Datenstruktur verwenden, sucht die Schleife automatisch nach der Iterator-Schnittstelle, ruft die Methode Symbol.iterator auf und gibt den Standarditerator des Objekts zurück.

ES6 legt fest, dass die Standard-Iterator-Schnittstelle in der Eigenschaft Symbol.iterator der Datenstruktur bereitgestellt wird. Mit anderen Worten: Solange eine Datenstruktur über die Eigenschaft Symbol.iterator verfügt, kann sie als „iterierbar“ betrachtet werden. . Die Eigenschaft Symbol.iterator selbst ist eine Funktion, bei der es sich um die Standardfunktion zur Iteratorgenerierung der aktuellen Datenstruktur handelt. Das Ausführen dieser Funktion gibt einen Traverser zurück.

Um ein iterierbares Objekt zu werden, muss ein Objekt (oder ein Objekt in seiner Prototypenkette) eine Eigenschaft namens Symbol.iterator haben:

Iterator-Protokoll

Das Iteratorprotokoll definiert eine Standardmethode zur Erzeugung einer endlichen oder unendlichen Folge von Werten.

Die ursprünglichen Datenstrukturen von JavaScript, die „Sets“ darstellen, sind hauptsächlich Arrays (Array) und Objekte (Object), und ES6 fügt Map und Set hinzu. Auf diese Weise gibt es vier Datensammlungen, die Benutzer auch in Kombination verwenden können, um ihre eigenen Datenstrukturen zu definieren. Beispielsweise sind die Mitglieder eines Arrays Karten und die Mitglieder von Karten sind Objekte. Dies erfordert einen einheitlichen Schnittstellenmechanismus, um alle unterschiedlichen Datenstrukturen zu verarbeiten.

Iterator (Iterator) ist ein solcher Mechanismus. Es handelt sich um eine Schnittstelle, die einen einheitlichen Zugriffsmechanismus für verschiedene Datenstrukturen bietet. Solange eine Datenstruktur die Iterator-Schnittstelle bereitstellt, kann sie den Durchlaufvorgang abschließen (d. h. alle Mitglieder der Datenstruktur nacheinander verarbeiten).

Iterator hat drei Funktionen: Erstens stellt er eine einheitliche und einfache Zugriffsschnittstelle für verschiedene Datenstrukturen bereit; zweitens ermöglicht er die Anordnung der Mitglieder der Datenstruktur in einer bestimmten Reihenfolge; drittens erstellt ES6 eine A Neuer Durchlaufbefehl for...of-Schleife, die Iterator-Schnittstelle wird hauptsächlich für den for...of-Verbrauch verwendet.

Der Durchlaufprozess von Iterator ist wie folgt.

1. Erstellt ein Zeigerobjekt, das auf die Startposition der aktuellen Datenstruktur zeigt. Mit anderen Worten, das Traverser-Objekt ist im Wesentlichen ein Zeigerobjekt.

2. Wenn Sie zum ersten Mal die nächste Methode des Zeigerobjekts aufrufen, können Sie den Zeiger auf das erste Mitglied der Datenstruktur verweisen.

3. Wenn die nächste Methode des Zeigerobjekts zum zweiten Mal aufgerufen wird, zeigt der Zeiger auf das zweite Mitglied der Datenstruktur.

4. Rufen Sie kontinuierlich die nächste Methode des Zeigerobjekts auf, bis es auf das Ende der Datenstruktur zeigt.

Jedes Mal, wenn die nächste Methode aufgerufen wird, werden die Informationen der aktuellen Mitglieder der Datenstruktur zurückgegeben. Konkret wird ein Objekt zurückgegeben, das zwei Eigenschaften enthält: value und done. Unter diesen ist das Wertattribut der Wert des aktuellen Mitglieds und das Fertigattribut ein boolescher Wert, der angibt, ob der Durchlauf beendet ist.

var someString = "hi";
typeof someString[Symbol.iterator]; // "function"
var iterator = someString[Symbol.iterator]();
iterator + "";  // "[object String Iterator]"
iterator.next()    // { value: "h", done: false }
iterator.next();   // { value: "i", done: false }
iterator.next();   // { value: undefined, done: true }

Die native Datenstruktur mit Iterator-Schnittstelle ist wie folgt.

1. Array

2. Karte

3. Set

4. String

5. TypedArray

6. Funktionsargumente-Objekt

7. NodeList-Objekt

Beachten Sie, dass Objekte keine Iterator-Schnittstelle haben, die von einer for...of-Schleife aufgerufen werden kann, muss sie die Traverser-Generierungsmethode (Prototyp) bereitstellen (Eigenschaft von Symbol.iterator. Objekte in der Kette können auch über diese Methode verfügen).

Rufen Sie die Iterator-Schnittstelle auf

Es gibt einige Fälle, in denen die Iterator-Schnittstelle (d. h. die Symbol.iterator-Methode) standardmäßig aufgerufen wird, mit Ausnahme von for ... die im Folgenden vorgestellt werden, ruft tatsächlich die Standard-Iterator-Schnittstelle auf.

Tatsächlich stellt dies einen einfachen Mechanismus bereit, um jede mit der Iterator-Schnittstelle bereitgestellte Datenstruktur in ein Array umzuwandeln. Mit anderen Worten: Solange eine Datenstruktur die Iterator-Schnittstelle bereitstellt, können Sie den Spread-Operator darauf verwenden, um sie in ein Array umzuwandeln.

Da die Array-Durchquerung die Traverser-Schnittstelle aufruft, ruft jede Gelegenheit, die ein Array als Parameter akzeptiert, tatsächlich die Traverser-Schnittstelle auf. Hier sind einige Beispiele.

1. for...of

2. Array.from()

3. Map(), Set(), WeakMap(), WeakSet() (z. B. new Map([['a',1],['b',2]]))

4. Versprechen. all ()

5. Promise.race()

for...of

for...of 循环是最新添加到 JavaScript 循环系列中的循环。

它结合了其兄弟循环形式 for 循环和 for...in 循环的优势，可以循环任何可迭代（也就是遵守可迭代协议）类型的数据。默认情况下，包含以下数据类型：String、Array、Map 和 Set，注意不包含 Object 数据类型（即 {}）。默认情况下，对象不可迭代。

在研究 for...of 循环之前，先快速了解下其他 for 循环，看看它们有哪些不足之处。

for 循环

for 循环的最大缺点是需要跟踪计数器和退出条件。我们使用变量 i 作为计数器来跟踪循环并访问数组中的值。我们还使用 Array.length 来判断循环的退出条件。

虽然 for 循环在循环数组时的确具有优势，但是某些数据结构不是数组，因此并非始终适合使用 loop 循环。

for...in 循环

for...in 循环改善了 for 循环的不足之处，它消除了计数器逻辑和退出条件。但是依然需要使用 index 来访问数组的值.

此外，当你需要向数组中添加额外的方法（或另一个对象）时，for...in 循环会带来很大的麻烦。因为 for...in 循环循环访问所有可枚举的属性，意味着如果向数组的原型中添加任何其他属性，这些属性也会出现在循环中。这就是为何在循环访问数组时，不建议使用 for...in 循环。

注意： forEach 循环 是另一种形式的 JavaScript 循环。但是，forEach() 实际上是数组方法，因此只能用在数组中。也无法停止或退出 forEach 循环。如果希望你的循环中出现这种行为，则需要使用基本的 for 循环。

for...of 循环

for...of 循环用于循环访问任何可迭代的数据类型。

const digits = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];

for (const digit of digits) {
 console.log(digit);
}

可以随时停止或退出 for...of 循环。

const digits = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];

for (const digit of digits) {
 if (digit % 2 === 0) {
  continue;
 }
 console.log(digit); //1,3,5,7,9
}

不用担心向对象中添加新的属性。for...of 循环将只循环访问对象中的值。

相关推荐：

实例分享PHP迭代器接口Iterator用法分析

调整JavaScript抽象的迭代方案

JavaScript数组的5种迭代方法实例详解

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des iterierbaren ES6-Protokolls und des Iteratorprotokolls. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!