In diesem Tutorial lernen Sie anhand von Beispielen JavaScript für… der Schleife kennen.
In JavaScript gibt es drei Möglichkeiten, wie wir eine forSchleife verwenden können.
- JavaScript für Schleife
- JavaScript für… in Schleife
- JavaScript für… der Schleife
Die for… ofSchleife wurde in späteren Versionen von JavaScript ES6 eingeführt .
Mit der for… ofSchleife in JavaScript können Sie iterierbare Objekte (Arrays, Sets, Maps, Strings usw.) durchlaufen.
JavaScript für… der Schleife
Die Syntax der for… ofSchleife lautet:
for (element of iterable) ( // body of for… of )
Hier,
- iterable - ein iterierbares Objekt (Array, Set, Strings usw.).
- Element - Elemente in der iterable
Im Klartext können Sie den obigen Code wie folgt lesen: Führen Sie für jedes Element in der Iterable den Hauptteil der Schleife aus.
für… von mit Arrays
Die for… ofSchleife kann verwendet werden, um über ein Array zu iterieren. Beispielsweise,
// array const students = ('John', 'Sara', 'Jack'); // using for… of for ( let element of students ) ( // display the values console.log(element); )
Ausgabe
John Sara Jack
Im obigen Programm wird die for… ofSchleife verwendet, um das Schülerarrayobjekt zu durchlaufen und alle seine Werte anzuzeigen.
für … von mit Strings
Sie können die for… ofSchleife verwenden, um Zeichenfolgenwerte zu durchlaufen. Beispielsweise,
// string const string = 'code'; // using for… of loop for (let i of string) ( console.log(i); )
Ausgabe
Code
für… von mit Sets
Mit der for… ofSchleife können Sie Set-Elemente durchlaufen . Beispielsweise,
// define Set const set = new Set((1, 2, 3)); // looping through Set for (let i of set) ( console.log(i); )
Ausgabe
1 2 3
für… von mit Karten
Mit der for… ofSchleife können Sie Map-Elemente durchlaufen . Beispielsweise,
// define Map let map = new Map(); // inserting elements map.set('name', 'Jack'); map.set('age', '27'); // looping through Map for (let (key, value) of map) ( console.log(key + '- ' + value); )
Ausgabe
Name- Jack Alter- 27
Benutzerdefinierte Iteratoren
Sie können einen Iterator manuell erstellen und die for… ofSchleife verwenden, um die Iteratoren zu durchlaufen. Beispielsweise,
// creating iterable object const iterableObj = ( // iterator method (Symbol.iterator)() ( let step = 0; return ( next() ( step++; if (step === 1) ( return ( value: '1', done: false); ) else if (step === 2) ( return ( value: '2', done: false); ) else if (step === 3) ( return ( value: '3', done: false); ) return ( value: '', done: true ); ) ) ) ) // iterating using for… of for (const i of iterableObj) ( console.log(i); )
Ausgabe
1 2 3
für… von mit Generatoren
Da Generatoren iterabel sind, können Sie einen Iterator auf einfachere Weise implementieren. Anschließend können Sie die Generatoren mithilfe der for… ofSchleife durchlaufen . Beispielsweise,
// generator function function* generatorFunc() ( yield 10; yield 20; yield 30; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )
Ausgabe
10 20 30
für… von Vs für… in
| für… von | für in |
|---|---|
Die for… ofSchleife wird verwendet, um die Werte einer Iterable zu durchlaufen. | Die for… inSchleife wird verwendet, um die Schlüssel eines Objekts zu durchlaufen. |
Die for… ofSchleife kann nicht zum Durchlaufen eines Objekts verwendet werden. | Sie können verwenden for… in, um über eine iterierbare solche Arrays und Strings zu iterieren, aber Sie sollten die Verwendung for… infür iterable vermeiden . |
Die for… ofSchleife wurde in ES6 eingeführt . Einige Browser unterstützen die Verwendung möglicherweise nicht. Um mehr zu erfahren, besuchen Sie JavaScript für… Support.
