V tomto tutoriálu se pomocí příkladů dozvíte o JavaScriptu… smyčky.
V JavaScriptu existují tři způsoby, jak můžeme použít forsmyčku.
- JavaScript pro smyčku
- JavaScript pro… ve smyčce
- JavaScript pro… smyčky
for… ofSmyčka byla zavedena v novějších verzích JavaScript ES6 .
for… ofSmyčka v JavaScriptu umožňuje iteraci přes iterable objektů (pole, sady, mapy, smyčce apod).
JavaScript pro… smyčky
Syntaxe for… ofsmyčky je:
for (element of iterable) ( // body of for… of )
Tady,
- iterovatelný - iterovatelný objekt (pole, množina, řetězce atd.).
- prvek - položky v iterovatelné položce
V jednoduché angličtině si můžete přečíst výše uvedený kód jako: pro každý prvek v iteraci spusťte tělo smyčky.
pro … z s poli
for… ofSmyčka může být použit pro iteraci přes pole. Například,
// array const students = ('John', 'Sara', 'Jack'); // using for… of for ( let element of students ) ( // display the values console.log(element); )
Výstup
John Sara Jack
Ve výše uvedeném programu se for… ofsmyčka používá k iteraci objektu pole studentů a zobrazení všech jeho hodnot.
pro … ze strun
for… ofK iteraci přes hodnoty řetězce můžete použít smyčku. Například,
// string const string = 'code'; // using for… of loop for (let i of string) ( console.log(i); )
Výstup
kód
pro… ze sad
Pomocí for… ofsmyčky můžete iterovat prvky Set . Například,
// define Set const set = new Set((1, 2, 3)); // looping through Set for (let i of set) ( console.log(i); )
Výstup
1 2 3
pro… z s Mapami
Pomocí for… ofsmyčky můžete iterovat prvky Map . Například,
// 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); )
Výstup
jméno - Jack věk - 27
Uživatelem definované iterátory
Můžete vytvořit iterátor ručně a pomocí for… ofsmyčky iterovat iterátory. Například,
// 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); )
Výstup
1 2 3
pro … z generátory
Protože generátory jsou iterovatelné, můžete iterátor implementovat jednodušším způsobem. Potom můžete iterovat generátory pomocí for… ofsmyčky. Například,
// generator function function* generatorFunc() ( yield 10; yield 20; yield 30; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )
Výstup
10 20 30
pro … z V pro … v
| pro… z | pro… v |
|---|---|
for… ofSmyčka se používá k iterovat hodnoty po dosažení iterable. | for… inSmyčka se používá iterovat klíče objektu. |
for… ofSmyčka nelze použít pro iteraci přes objekt. | Můžete použít for… ink iteraci přes iterovatelná taková pole a řetězce, ale měli byste se vyhnout použití for… inpro iterable. |
for… ofSmyčka byl představen v ES6 . Některé prohlížeče nemusí jeho použití podporovat. Chcete-li se dozvědět více, navštivte JavaScript pro… podpory.
