Ebben az oktatóanyagban példák segítségével megismerheti a… ciklus JavaScript-jét.
A JavaScript-ben háromféle módon használhatjuk a forciklust.
- JavaScript for loop
- JavaScript for… ciklusban
- JavaScript a hurok… számára
A for… ofciklus a JavaScript ES6 későbbi verzióiban került bevezetésre .
A for… ofJavaScript hurkja lehetővé teszi az iterálható objektumok (tömbök, halmazok, térképek, karakterláncok stb.) Ismétlését.
JavaScript a hurok… számára
A for… ofhurok szintaxisa :
for (element of iterable) ( // body of for… of )
Itt,
- iterálható - iterálható objektum (tömb, halmaz, karakterláncok stb.).
- elem - az iterálható elemek
Egyszerű angol nyelven a fenti kódot a következőképpen olvashatja el: futtassa a ciklus törzsét az iterable minden eleméhez.
… -ig a tömbökkel
A for… ofhurok használható egy tömbön történő iterációra. Például,
// array const students = ('John', 'Sara', 'Jack'); // using for… of for ( let element of students ) ( // display the values console.log(element); )
Kimenet
John Sara Jack
A fenti programban a for… ofciklus a hallgatók tömbobjektumának iterációjára és annak összes értékének megjelenítésére szolgál.
mert… a karakterláncokkal
Használhatja a for… ofciklust a karakterlánc-értékek iterálásához. Például,
// string const string = 'code'; // using for… of loop for (let i of string) ( console.log(i); )
Kimenet
kód
mert… a Sets-szel
A for… ofciklus segítségével iterálhat a Set elemek között . Például,
// define Set const set = new Set((1, 2, 3)); // looping through Set for (let i of set) ( console.log(i); )
Kimenet
1 2 3
… -ra a Maps segítségével
A for… ofciklus segítségével iterálhat a Map elemeken keresztül . Például,
// 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); )
Kimenet
név- Jack életkora- 27
Felhasználó által meghatározott iterátorok
Létrehozhat iterátort manuálisan, és a for… ofhurok segítségével iterálhat az iterátorokon keresztül. Például,
// 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); )
Kimenet
1 2 3
mert… a generátorokkal
Mivel a generátorok iterálhatók, könnyebben megvalósíthat egy iterátort. Ezután a for… ofciklus segítségével iterálhat a generátorokon keresztül . Például,
// generator function function* generatorFunc() ( yield 10; yield 20; yield 30; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )
Kimenet
10 20 30
… V-re… -ra… -ban
| … -ig | be |
|---|---|
A for… ofciklust egy iterálható értékek közötti iterációra használják. | A for… inhurok egy objektum kulcsain keresztüli iterációra szolgál. |
A for… ofhurok nem használható egy objektum iterációjára. | Használhatja for… initerálható ilyen tömbök és karakterláncok felett, de kerülje for… inaz iterable használatát. |
A for… ofhurkot az ES6- ban vezették be . Egyes böngészők nem támogatják a használatát. Ha többet szeretne megtudni, keresse fel a JavaScript-et a … támogatáshoz.
