JavaScript iteratori i generatori

Jedna od novosti uvedenih u ECMAScript 5 standardu su protokoli iteracije. U pitanju su iterable i iterator protokoli.

Iteracije smo upoznali prilikom rada sa nizovima. Poznato nam je da nizovi, odnosno Array objekat ima metode za prolazak kroz elemente niza. Pri tome, programer definiše callback funkciju koja se poziva pri svakoj iteraciji, odnosno za svaki elemenat niza. Uvođenjem iteratora, za bilo koji objekat možemo definisati prolazak kroz njegove podatke putem "uzastopnih upita", odnosno iteracija.

U ovom tekstu baratamo sa nekoliko sličnih termina - pazite da se ne zbunite. Evo "rečnika":

• iterabilni objekat - objekat kroz koji želimo da vršimo iteracije kako bismo i svakoj iteraciji dolazili do novog podatka
• iteratorska funkcija i generatorska funkcija - funkcija koja definiše same podatke za svaku iteraciju i čini objekat iterabilnim
• iterator i generator - "pomoćni" objekti kojim u stvari vršimo iteracije i pozivamo podatak po podatak iz iterabilnog objekta

Iterable protokol omogućava programeru da definiše ponašanje nekog objekta prilikom iterativnog poziva. Drugim rečima, moguće je definisati iterativno ponašanje i podatke koje objekat vraća prilikom svake iteracije, čak i za objekte koji inače nemaju ovo ponašanje ugrađeno. Isto tako, moguće je promeniti rezultate iteracije i onim objektima koji već imaju ovo ponašanje.

Objekti kroz koje je moguće vršiti iteracije imaju (ili nasleđuju) interni @@iterator metod. Ovom metodu ne pristupamo direktno, već preko konstante Symbol.iterator. Ovo svojstvo objekta je referenca na iteratorsku funkciju.

Iteratorska funkcija je specifična samo po tome što vraća rezultat prema iterator protokolu. Ovaj protokol prosto zahteva da najpre funkcija kreira objekat koji zovemo "iterator" i takođe služi da obezbedi closure za iteratorov metod next() koji se poziva u svakoj iteraciji.

Dakle iterator ima obavezno makar metod next(), od koga se očekuje da pri svakom pozivu obezbedi (nov) rezultat u tačno određenoj formi. Drugim rečima, podatak koji tražimo u svakoj iteraciji, ne dobijamo samo tako, kao "suv podatak" već se nalazi "spakovan" unutar objekta, koji u stvari predstavlja vraćeni rezultat metoda next(). Ovaj objekat ima dva svojstva:

• done - logička vrednost; ako je false (ili ne postoji), znači da ima još podataka, dok vrednost true, označava da podataka više nema
• value - sam podatak, ne mora da se navede ako je done == true

Kada objektu definišemo ovakav metod i povežemo ga preko Symbol.iterator konstante, učinili smo taj objekat "iterabilnim". Kako se onda koristi iterator?

Na početku pozivamo iteratorsku funkciju, koja kao rezultat vraća objekat sa next() metodom. Uzastopnim pozivanjem next() metoda ovog objekta dobijamo jedan po jedan podatak "umotan" u objekat koji nas obaveštava da li smo završili sa prolaskom kroz podatke i ako nismo, koja je vrednost samog podatka.

  // kreiramo neki objekat
  let obj = {
    valuesHigh: [89, 134, 111, 96, 102, 99], 
    valuesLow: [34, 22, 52, 47, 61]
  };
  
  // objektu dodajemo iteratorsku funkciju
  obj[Symbol.iterator] = function() {
    let _self = this;
    let i = -1;
    let N = Math.min(this.valuesHigh.length, this.valuesLow.length);
    return {
      next: function() {
        i++;
        if (i<N)
          return { value: (_self.valuesHigh[i] + _self.valuesLow[i]) /2 };
        else 
          return { done: true };
      }
    };
  };
  
  // dobijamo iterator objekat
  let iterator = obj[Symbol.iterator]();
  
  // najzad, same iteracije
  console.log( iterator.next().value );  // 61.5 = (89+34)/2
  console.log( iterator.next().value );  // 78
  // ...
  console.log( iterator.next().value );  // undefined

  let obj = {
    valuesHigh: [89, 134, 111, 96, 102, 99], 
    valuesLow: [34, 22, 52, 47, 61],
    [Symbol.iterator]: function() { ... }
  };

Ciklus for..of

Kada želimo da iterativno prođemo kroz neki objekat, možemo koristiti specijalan tip ciklusa for..of. Za razliku od for..in ciklusa koji nam služi da "nabrojimo" svojstva nekog objekta, for..of petlju možemo koristiti samo nad objektom koji ima definsano iterativno ponašanje.

Na primer, nizovi i stringovi su po defaultu iterable objekti, pa tako nad njima možemo koristiti i for..of ciklus. Rezultati, odnosno podaci koje dobijamo u ovom ciklusu će zavisiti od samog objekta. Array objekat, po definiciji, kroz svaku iteraciju vraća po jedan elemenat niza. Sa druge strane, objekat String kroz svaku iteraciju vraća po jedan znak stringa. Evo kako se zadaje for..of petlja:

Pri svakom prolasku kroz ciklus, promenljiva podatak dobija vrednost podatka koji se vraća kroz iterator. Ovde ne moramo da vodimo računa o pozivanju iteratorske funkcije, iteratoru, next() metodi, niti njenoj povratnoj vrednosti - ne zanimaju nas ni svojstva value ni done. Sve se obavlja automatski.

Kada koristimo for..of petlju, vrši se automatska inicijalizacija iteracija. To u stvari znači da ne moramo da pozivamo iteratorsku funkciju objekta kako bismo "izvukli" iteratorski objekat.

Ako iz nekog razloga prekinemo for..of petlju (npr. korišćenjem direktive break), kasnije možemo ponovo pokrenuti for..of, ali iteracije se neće nastaviti, već početi od početka.

  let iterator = obj[Symbol.iterator]();
  
  do {
    let rezultat = iterator.next();
    if (!rezultat.done)
      console.log( rezultat.value );
  } while (!rezultat.done);

  for (let podatak of obj) {
    console.log( podatak );
  }

Generatorska funkcija

U ECMAScript 6 verziji JavaScripta, još je više urađeno po pitanju olakšavanja dodavanja iterabilnosti objektu. Vidite, uvođenje funkcije iteratora može brzo da se iskomplikuje i programeri lako prave greške kod formiranja rezultata.

Upravo da bi se programerima "olakšao život", uvedene su generatorske funkcije. Njihova primarna uloga je uvođenje iterativnog ponašanja, ali se u stvari mogu koristiti u različitim situacijama.

Generatorska funkcija može prekinuti svoje izvršavanje i kasnije ga nastaviti "po pozivu". Tako ova funkcija može raditi "u nastavcima". Interpreter zna da je neka funkcija generatorska, ako je obeležena simbolom * (zvezdicom).

Kako funkcioniše ta stvar sa prekidanjem i nastavljanjem izvršavanja funkcje? Svi znamo da funkcija vraća rezultat direktivom return. Međutim, u generatorskim funkcijama se može koristiti i specijalna direktiva yield, koja takođe vraća vrednost i prekida rad funkcije, ali isto tako predstavlja tačku kasnijeg povrataka i nastavka rada funkcije.

To znači da u generatorskoj funkciji možemo imati više puta zadatu direktivu yield. Pošto suštinski generatorska funkcija predstavlja poseban tip iteratorske funkcije, i ona funkcioniše po iterator protokolu. To znači da pozivanjem generatorske funkcije dobijamo generator objekat (koji je praktično specijalna verzija iteratora), sve sa next() metodom koju možemo uzastopno pozivati. Svaki generator.next() poziv nas "vraća" u generatorsku funkciju na poziciju posle poslednje yield direktive.

Kao i svaka druga funkcija, i generatorska može imati direktivu return, s tim što posle izvršavanja return, nema više vraćanja u funkciju - to znači da je generator objekat "odsvirao svoje". Isto važi i za prirodno stizanje do kraja generatorske funkcije. U oba slučaja će svaki sledeći poziv metoda next() vraćati vrednost undefined.

Osim next(), generator ima još dva metoda za poziv, odnosno povratak u generatorsku funkciju. To su return() i throw().

Metod return() nas izbacuje iz generatora, kao da je u funkciji momentalno naleteo na return. Vraća objekat {done:true, value:undefined}. Posle toga, nema više iteracija.

Metod throw() radi to isto, s tim što ne vraća rezultat već podiže izuzetak (exception), kao da smo naleteli na grešku u izvršavanju programa pri pozivu metoda next().

Kao da to nije dosta, metod next() iteratorskog objekta može imati i neku vrednost zadatu kao parametar. Ova vrednost se tada prosleđuje generatoru na mestu gde se nalazio poslednji izvršeni yield, što onda postaje vrednost yield izraza. Deluje komplikovano? Pogledajte sliku, biće jasnije.

1. Na početku pozivamo generatorsku funkciju gen().
2. Rezultat tog poziva je generator objekat, na koji će pokazivati referenca itr.
3. Sada koristimo metod next() objekta itr kako bismo izvršili prvi deo koda iz generatorske funkcije.
4. Kada naiđe na yield, "iskače" iz funkcije, a kao rezultat se vraća vrednost v1, koja se nalazi unutar objekta i to pod svojstvom value, što se smešta u promenljivu x.
5. Ponovo pozivamo metod next() generatora, čime se vraćamo u generatorsku funkciju i nastavljamo sa drugim delom koda.
6. Kada stigne do sledećeg yield, pnovo će prekinuti izvršavanje funkcije i vratiće vrednost v2, koja će na kraju završiti u promenljivoj y.
7. Ponovo pozivamo metod next() kako bismo nastavili izvršavanje generatora, ali ovaj put prosleđujemo i neku vrednost v, koja će predstavljati vrednost poslednjeg yield izraza i biće smeštena u lokalnu promenljivu p, da bi se odmah potom nastavilo izvršavanje trećeg dela funkcije.
8. Ponovo nailazi na yield, prekida funkciju i vraća vrednost v3, koja se smešta u promenljivu z.
9. Poslednji put pozivamo metod next(), da bi se vratio u funkciju i izvršio četvrti deo koda.
10. Konačno, generatorska funkcija vraća poslednju vrednost v4 direktivom return, koja se smešta u promenljivu w. Posle return (ili kad se stigne do kraja funkcije) nema više povratka u funkciju, gotovo je sa iteracijama. Svaki sledeći poziv next() metode vratiće vrednost undefined.

Pogledajte kako funkcioniše upravo ovaj primer sa slike.

Inače, sve ovo važi i za metode return() i throw(), s tim što prosleđena vrednost kod return() predstavlja i vrednost koja će biti vraćena, dok kod throw(), prosleđena vrednost predstavlja vrednost objavljene greške, tj. izuzetka.

  // generatorska funkcija
  function* fibGen() {
    let a = 0;
    let b = 1;
    while (true) {
      let x = a+b;
      a = b;
      b = x;
      yield a;
    }
  }

  // kreiranje i korišćenje generatora
  let fib = fibGen();
  for (let i=0; i<10; i++)
    console.log(fib.next().value); // 1,1,2,3,5, ... 55

  console.log(fib.next().value);  // 89 - kad god poželimo, dobijamo sledeću vrednost

  console.log(fib.return("Gotovo").value);  // "Gotovo" - zatvaramo generator
  
  console.log(fib.next().value);  // undefined

  // kreiramo neki objekat
  let obj = {
    valuesHigh: [89, 134, 111, 96, 102, 99], 
    valuesLow: [34, 22, 52, 47, 61]
  };
  
  // objekat postaje iterabilan preko generatorske funkcije
  obj[Symbol.iterator] = function*() {
    let N = Math.min(this.valuesHigh.length, this.valuesLow.length);
    for (let i=0; i<N; i++) {
      yield (this.valuesHigh[i] + this.valuesLow[i]) /2;
    }
  };

  // kao i sa iteratorom, možemo iščitavati podatke u for..of petlji
  for (let podatak of obj) {
    console.log( podatak );
  }

  // isto tako smo mogli i "ručno" da čitamo preko generator objekta
  let generator = obj[Symbol.iterator]();
  
  console.log( generator.next().value );  // 61.5 = (89+34)/2
  console.log( generator.next().value );  // 78
  // ...
  console.log( generator.next().value );  // undefined