ITÉRATEUR D'ÉNUMÉRABLES, GÉNÉRATEUR, YIELD ET NEXT

ITÉRATIONS, GÉNÉRATEUR, YIELD et NEXT
ES10 Ité r a t eurs, Géné r at eur s,
& Ité r a b l es
JAVASCRIPT (Programmation Internet) VOL. VI
J.B. Dadet DIASOLUKA Luyalu Nzoyifuanga
+243 - 851278216 - 899508675 - 991239212 - 902263541 - 813572818
CHAPITRE 10 :
GÉNÉRATEUR, YIELD et NEXT :
Les générateurs sont des fonctions qu'on peut quitter puis reprendre
(continuer). Le contexte d'un générateur (les liaisons avec ses va-
riables) est sauvegardé entre deux invocations. C’est donc aussi un bon
moyen d’utiliser des variables statiques dans JavaScript, en plus des clo-
sures (fermetures, et curries [currying ou Curryfication]).
Le corps d’une fonction génératrice function* (« generator », notez
l’astérisque) n'est pas exécuté immédiatement lors de la créa-
tion/définition d’une variable, mais plutôt renvoie un objet ayant seule-
ment deux propriétés, la première ayant le nom « value » et qui emma-
gasine la valeur retournée par yield, la deuxième ayant le nom « done »
qui indique si le générateur est toujours actif (pas terminé).
La 1ère fois que la méthode « .next() » est appelé de l’objet itérateur créé,
le corps de la fonction génératrice est exécuté de son début jusqu'à la
première occurrence de l’instruction yield rencontrée, qui définira la
valeur à renvoyer à l’objet itérateur qui l’aura appelé avec cette instruc-
tion « .next ».
En fait tout se passe comme si (et c’est ainsi) « next » parcourt l’un
après l’autre les éléments de l’itérable en incrémentant l’indexeur.

J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-VI
Itérateur–Générateur–Itérables -3/54- vendredi, 31. mai 2019 (11:27 )
Illustration et comparaison :
I. VERSION STRING
<script type = "text/javascript"> "use strict";
const s = "diasoluka"; // Chaîne
let a = Array.from(s) , // Array
i = 0; // index
do {
console.log(`s : ${a[i++]}`)
} while (i < a.length);
</script>
<script type = "text/javascript"> "use strict";
console.log("=".repeat(15));
</script>
II. VERSION PROTOCOLES D'ITÉRATION
<script type = "text/javascript"> "use strict";
let alias;
const si = "diasoluka"; // Chaîne
var ii = si [Symbol.iterator]();
// Équivaut à
// let a = Array.from(s) , // Array
// ii = 0; // index
while(alias = ii.next() , ! alias.done){
console.log(`it = ${alias.value}`)
};
// Cette boucle while() équivaut à
// do {
// console.log(`s : ${a[i++]}`)
// } while (i < a.length);
</script>
N.B. : Un « objet itérateur » est créé sans l’opérateur « new ».

J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-VI
Itérateur–Générateur–Itérables -4/54- vendredi, 31. mai 2019 (11:27 )
Tout comme la commande return, la commande yield renvoie une va-
leur de retour mais dans la propriété .value de l’objet itérateur. La
commande return quant à elle renvoie la valeur de retour dans le propre
type de cette dernière.
Contrairement à return, yield ne clôt pas l’exécution de la fonction géné-
ratrice mais la suspend seulement pour être poursuivie à l’invocation de
la prochaine méthode .next(), qui exécutera jusqu’à la rencontre de la
prochaine instruction yield ou return.
<script>
function* repSces(obj) {
console.log("Avant yield");
yield obj;
}
let it = repSces(
console.log("Génération en cours"));
console.log("Appel à .next()");
console.log(`it.next()= `, it.next());
</script>

J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-VI
Itérateur–Générateur–Itérables -5/54- vendredi, 31. mai 2019 (11:27 )
En simple, on peut dire que
1. yield est une sorte de return qui contrairement à ce dernier ne clôt
pas mais suspend/interrompt l’exécution de la fonction génératrice.
La valeur de la propriété « générateur.done » demeure true.
2. return retourne aussi une valeur mais clôt le générateur, la valeur de
la propriété « générateur.done » devenant false.
3. Cette fonction génératrice est définie avec le mot clé iterator.
4. La méthode .next(), appelée pour la première fois, exécute toute la
fonction génératrice jusqu’à yield. Les prochaines fois que .next()
est appelée, elle poursuit l’exécution de la fonction génératrice là où
yield l’avait suspendue.
5. Chaque appel à la méthode .next() doit avoir un yield qui lui est as-
socié dans le générateur. Une façon facile de le garantir est d’utiliser
une boucle valide qui contient l’instruction yield. Pendant qu’on est
dans cette boucle yield renvoie une valeur valide, dès qu’on quitte la
boucle elle (yield) renvoie undefined, à moins de prévoir des yield
supplémentaire après et en dehors de cette boucle.
6. Mais il n’est pas nécessaire (bien que souvent inutile) d’avoir plus de
yield dans le générateur que de .next() appelées.

J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-VI
Itérateur–Générateur–Itérables -6/54- vendredi, 31. mai 2019 (11:27 )
7. Un yield n’est pas obligé d’être dans une boucle.
8. Tout comme return, yield renvoie des valeurs de tout type, pas seu-
lement des booléennes, mais il (le yield) n’est pas non plus obligé
d’en renvoyer explicitement, par exemple quand le .next() qui
l’appelle utilise un ou des arguments.
9. La valeur de retour de yield peut être utilisée « in situ » [ex. con-
sole.log(yield)] ou être recueillie à partir de la propriété .« value » de
la méthode .next() de l’obet générateur [ex. gen.next().value].
10. Comme yield ne clôt pas la fonction mais seulement la suspend, les
variables locales de la fonction génératrice persistent donc après
cette suspension par yield.
En fait on peut comprendre la méthode « next » comme demandant au
« yield » d’envoyer la prochaine valeur de retour.
11. La boucle « for…of » agit sur les « itérables », tandis que la boucle
« for…in » agit sur les « énumérables ».
Mais « yield » permet aussi de créer un objet « itérable » :
<script type="text/javascript"> "use strict";
const iterable = {
*[Symbol.iterator]() {
yield "Date() = " + Date();
yield "Date.now() = " + Date.now();
yield "Math.PI = " + Math.PI;
yield "Math.E = " + Math.E;
}
};
for (let i of iterable) console.log(i);
console.log([...iterable])
</script>