javascript tome iv - Itérations

J.B. Dadet DIASOLUKA Luyalu Nzoyifuanga
JAVASC RI PT (Programmation Internet) VOL. IV
+243 - 851278216 - 899508675 - 995624714 - 902263541 - 813572818
La dernière révision de ce texte est disponible sur CD.
CHAPITRE 10 :
ITÉRATIONS :
Un « ITERATEUR » est un object retourné par l'invocation
de
« [Symbol.iterator]() » sur un itérable comme ceci :
itérable.[Symbol.iterator]().
Cette instruction récupère à tour de rôle chacun des élé-
ments
dans un objet et les retourne via sa méthode « next() ».
Une « ITÉRATION » est un parcours/listage d'éléments
(ici des PROPRIÉTÉS), un après l'autre à chaque demande
(ici avec la méthode « next »). Voir plus loin.
Un « résultat d'itération est un
OBJET
comme on peut le voir ci-dessous.
ATTENTION :
Une propriété « enumerable » peut être listé par une boucle

J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-IV
Itérations 2 / 44 mardi, 2. octobre 2018
« for...in ».
Un « itérable » est un objet qui peut être parcouru avec une
méthode dont la clé est « Symbol.iterator ».
Voici un exemple facile d’Itération [Synchrone] ::
<script type="text/javascript"> "use strict";
const ITERABLE = ['Oeil', 'Rétine', 'Nerf Optique',
"Chiasma", "Tractus Optique",
"Corps Genouillés Externes = Corps Gé niculés Latéraux
(Thalamus)",
"Radiations Optiques",
"Cortex Céré bral du Lobe Occipital (Scissure Calcarine)
ainsi qu'une partie du lobe temporal et pariétal",
"Hypothalamus", "Colliculi Supérieurs",
"Noyaux du Tractus Optique Accessoire"];
const ITERATOR = ITERABLE[Symbol.iterator]();
for(let key in ITERABLE)console.log(ITERATOR.next())
console.log(ITERATOR.next())
console.log(ITERATOR.next())
</script>
Exécution :
Object { value: "Oeil", done: false }
Object { value: "Rétine", done: false }
Object { value: "Nerf Optique", done: false }
Object { value: "Chiasma", done: false }
Object { value: "Tractus Optique", done: false }
Object { value: "Corps Genouillé s Externes = Corps Génicu-
lés Latéraux (Thalamus)", done: false }
Object { value: "Radiations Optiques", done: false }
Object { value: "Cortex Céré bral du Lobe Occipital (Scis-
sure Calcarine) ainsi qu'une partie du lobe temporal et
pariétal ", done: false }
Object { value: "Hypothalamus", done: false }

J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-IV
Itérations 3 / 44 mardi, 2. octobre 2018
Object { value: "Colliculi Supérieurs", done: false }
Object { value: "Noyaux du Tractus Optique Accessoire",
done: false }
Object { value: undefined, done: true }
Object { value: undefined, done: true }
Appliquons cela (usage d’itérateur) à un objet JavaScript :
<script type="text/javascript"> "use strict";
console.log("DESCRIPTEURS DES PROPRIéTéS DE L'OBJET
window")
const win_ownPropertyDescriptors = Ob-
ject.getOwnPropertyDescriptors(window);
console.log(win_ownPropertyDescriptors)
/*
Object { undefined: {…}, Array: {…}, Boolean: {…},
Date: {…}, Math: {…}, Number: {…}, String: {…}, Re-
gExp: {…}, Error: {…}, InternalError: {…}, … }
*/
console.log("=====")
console.log("NOMS (CLéS) DE CES PROPRIéTéS DE L'OB-
JET window")
const win_ownPropertyNames = Ob-
ject.getOwnPropertyNames(window);
console.log(win_ownPropertyNames)
/*
Array [ "undefined", "InstallTrigger", "Function",
"Object", "eval", "EventTarget", "Window", "close",
"stop", "focus", … ]
*/
console.log("=====")
console.log("CES MéMES CLéS, AVEC UN ITéRATEUR (va-
lue ET done)")
//

J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-IV
Itérations 4 / 44 mardi, 2. octobre 2018
// Ci-dessous, «
win_ownPropertyNames[Symbol.iterator]() » est un
// objet ITéRABLE contenant les OwnProperties de «
window »
// (voir ci-dessus).
//
// Un itérateur (voir plus loin) permettra d'itérer
les propriétés
// de cet objet qui contient les OwnProperties de «
window ».
const iterator =
win_ownPropertyNames[Symbol.iterator]();
//
// Un « ITERATEUR » est un object retourné par
l'invocation de
// « [Symbol.iterator]() » sur an itérable comme
ceci :
// itérable.[Symbol.iterator]().
// Cette instruction récupére é tour de réle chacun
des éléments
// dans un object et les retourne via sa méthode «
next() ».
console.log(iterator)
// Array Iterator { }
// __proto__: Array Iterator
// next: function next()
// Symbol(Symbol.toStringTag): undefined
// __proto__: Object { … }
console.log("=====")
// Une « ITéRATION » est un parcours/listage d'élé-
ments
// (ici des PROPRIéTéS), un aprés l'autre é chaque
demande
// (ici avec la méthode « next »). Voir plus loin.
//
// Un « résultat d'itération est un OBJET
// comme on peut le voir ci-dessous.
console.log("éNUMéRATION DE CES CLéS PAR ITéRATEUR

J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-IV
Itérations 5 / 44 mardi, 2. octobre 2018
AVEC UNE BOUCLE for...in")
for(let key in
win_ownPropertyNames)console.log(iterator.next())
/*
Object { value: "undefined", done: false }
Object { value: "InstallTrigger", done: false }
Object { value: "Function", done: false }
Object { value: "Object", done: false }
Object { value: "eval", done: false }
Object { value: "EventTarget", done: false }
Object { value: "Window", done: false }
Object { value: "close", done: false }
Object { value: "stop", done: false }
Object { value: "focus", done: false }
Object { value: "blur", done: false }
Object { value: "open", done: false }
Object { value: "alert", done: false }
Object { value: "confirm", done: false }
Object { value: "prompt", done: false }
Object { value: "print", done: false }
Object { value: "postMessage", done: false }
Object { value: "captureEvents", done: false }
Object { value: "releaseEvents", done: false }
Object { value: "getSelection", done: false }
Object { value: "getComputedStyle", done: false }
Object { value: "matchMedia", done: false }
Object { value: "moveTo", done: false }
Object { value: "moveBy", done: false }
Object { value: "resizeTo", done: false }
Object { value: "resizeBy", done: false }
Object { value: "scroll", done: false }
Object { value: "scrollTo", done: false }
Object { value: "scrollBy", done: false }
Object { value: "requestAnimationFrame", done:
false }
Object { value: "cancelAnimationFrame", done: false }
Object { value: "getDefaultComputedStyle", done:
false }
Object { value: "scrollByLines", done: false }
Object { value: "scrollByPages", done: false }
Object { value: "sizeToContent", done: false }
Object { value: "updateCommands", done: false }
Object { value: "find", done: false }
Object { value: "dump", done: false }
Object { value: "setResizable", done: false }