În acest tutorial, veți afla despre JavaScript pentru … buclă cu ajutorul exemplelor.
În JavaScript, există trei moduri în care putem folosi o forbuclă.
- JavaScript pentru buclă
- JavaScript pentru … în buclă
- JavaScript pentru … de buclă
for… ofBucla a fost introdus în versiunile ulterioare ale JavaScript ES6 .
for… ofBucla în JavaScript vă permite să itera obiecte iterable (tablouri, seturi, hărți, siruri de caractere etc).
JavaScript pentru … de buclă
Sintaxa for… ofbuclei este:
for (element of iterable) ( // body of for… of )
Aici,
- iterabil - un obiect iterabil (matrice, set, șiruri etc.).
- element - elemente din iterabil
În engleză simplă, puteți citi codul de mai sus astfel: pentru fiecare element din iterabil, rulați corpul buclei.
pentru … de la Arrays
for… ofBucla poate fi folosit pentru a itera peste o matrice. De exemplu,
// array const students = ('John', 'Sara', 'Jack'); // using for… of for ( let element of students ) ( // display the values console.log(element); )
Ieșire
John Sara Jack
În programul de mai sus, for… ofbucla este utilizată pentru a itera peste obiectul matricei studenților și pentru a afișa toate valorile sale.
pentru … de cu Strings
Puteți utiliza for… ofbucla pentru a itera peste valorile șirului. De exemplu,
// string const string = 'code'; // using for… of loop for (let i of string) ( console.log(i); )
Ieșire
cod
pentru … din cu Seturi
Puteți itera prin Set elemente folosind for… ofbucla. De exemplu,
// define Set const set = new Set((1, 2, 3)); // looping through Set for (let i of set) ( console.log(i); )
Ieșire
1 2 3
pentru … de cu Hărți
Puteți itera prin elemente de hartă folosind for… ofbucla. De exemplu,
// 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); )
Ieșire
nume- Jack vârsta- 27 de ani
Iteratori definiti de utilizator
Puteți crea manual un iterator și puteți utiliza for… ofbucla pentru a itera prin iteratoare. De exemplu,
// 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); )
Ieșire
1 2 3
pentru … de la Generatoare
Deoarece generatoarele sunt iterabile, puteți implementa un iterator într-un mod mai ușor. Apoi, puteți itera prin generatoare folosind for… ofbucla. De exemplu,
// generator function function* generatorFunc() ( yield 10; yield 20; yield 30; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )
Ieșire
10 20 30
pentru … de Vs pentru … în
| pentru … din | pentru … în |
|---|---|
for… ofBucla este folosit pentru a itera prin valorile unei iterable. | for… inBucla este folosit pentru a itera prin cheile unui obiect. |
for… ofBucla nu poate fi folosit pentru a itera unui obiect. | Puteți utiliza for… inpentru a itera peste o iterabilă astfel de matrice și șiruri, dar ar trebui să evitați utilizarea for… inpentru iterabile. |
for… ofBucla a fost introdusă în ES6 . Este posibil ca unele browsere să nu accepte utilizarea acestuia. Pentru a afla mai multe, vizitați JavaScript pentru … de asistență.
