Úvod do iterátorů a generátorů v JavaScriptu

Od roku 2015 přinesl EcmaScript6 (ES6) mnoho vylepšení v postupech kódování JavaScriptu. Do JavaScriptu byla zavedena řada moderních konceptů, což výrazně zlepšilo zážitek z kódování. V tomto článku se dozvíte o iterátorech a generátorech v JavaScriptu.

Iterátory a generátory jsou dva různé pojmy, ale používají se podobným způsobem. Používají se k iteraci prostřednictvím polí a objektů v JavaScriptu.

Iterátory

Iterátory jsou jako pokročilé smyčky, které lze pozastavit. Iterátory se skládají z další() funkce, která vrací hodnotu a stav hotovo. The hodnota pole je hodnota v poli v daném indexu. Hotovo je logická hodnota, která vrací stav dokončení pro iteraci prostřednictvím smyčky.

Zde je příklad, který ukazuje, jak iterátory:

funkce fruitIter (ovoce) {
nechť index = 0;
vrátit se {
další: function () {
návratový index }
}
}
const fruitArray = ["Mango", "Banán", "Hrozny"];
konst ovoce = fruitIter (fruitArray);
console.log (fruit.next (). hodnota);

Výstup:

Mango

Když minete ovoceArray pole v ovoceIter ()

metoda, vrátí iterátor, který je uložen v ovoce proměnná. The index proměnná v ovoceIter () metoda se inicializuje na 0. Tato metoda vrací další() funkce, která pomáhá v procházející polem. The další() funkce kontroluje, zda je index menší než ovoceArray délka. Pokud ano, vrátí dvě proměnné: název ovoce v tomto indexu a Hotovo postavení. Při vracení těchto hodnot také zvyšuje hodnotu indexu.

Chcete -li zkontrolovat, jak tato metoda funguje, a vytisknout název ovoce, musíte zavolat další() funkce na ovoce iterátoru a získat přístup k jeho hodnotě.

Příbuzný: Co je funkce v programování?

Generátory

Generátory jsou podobné iterátorům, ale vracejí více hodnot. Tyto hodnoty se nazývají hodnoty výtěžku. Funkce generátoru jsou zapsány pomocí funkce* syntaxe. * označuje, že to není normální funkce, ale generátor. Zde je příklad generátorů:

funkce* printFruits () {
výnos "Mango";
výnos "Banana";
výnos "Hrozny";
}
konst ovoce = printFruits ();
console.log (fruit.next ()); 

Výstup:

{value: 'Mango', done: false}

V tomto případě výtěžek je iterátor. Když zavoláte funkci printFruits ()a vytiskněte fruit.next (), dává vám objekt, kde získáte hodnotu. The Hotovo status označuje, zda byly všechny hodnoty iterovány.

Naučte se datové struktury pomocí tříd ES6 v JavaScriptu

JavaScript ES6 přinesl velký pokrok v kódovacích postupech. V neposlední řadě jde o budování datových struktur pomocí tříd ES6. Tam. pop, a vydejte se na vrchol a staňte se profesionálem JavaScriptu!

Jak vytvářet datové struktury pomocí tříd JavaScript ES6

Se zavedením JavaScriptu ES6 přišly vlastní datové struktury. Zde je návod, jak je vytvořit a použít.

Číst dále

O autorovi