Warning: JavaScript 1.6's for-each-in loops are deprecated

Message

Warning: JavaScript 1.6's for-each-in loops are deprecated; consider using ES6 for-of instead

Type d'erreur

Avertissement.

Quel est le problème ?

L'instruction for each (variable in obj) présente à partir de JavaScript 1.6 est une instruction dépréciée et est amenée à disparaître dans un avenir proche.

Exemples

Itérer sur un objet

for each...in pouvait être utilisé pour parcourir les valeurs contenues dans un objet.

Syntaxe dépréciée

var objet = { a: 10, b: 20 };

for each (var x in objet) {
  console.log(x);        // 10
                         // 20
}

Syntaxe alternative, standard

On peut désormais utilisé l'instruction de boucle standard for...in afin d'itérer sur les clés d'un objet et de récupérer les valeurs des propriétés :

var objet = { a: 10, b: 20 };

for (var key in objet) {
  var x = objet[key];
  console.log(x);        // 10
                         // 20
}

Ou alors, on peut utiliser for...of (ES2015) et Object.values (ES2017) afin d'obtenir un tableau des valeurs associées à un objet pour ensuite le parcourir :

var objet = { a: 10, b: 20 };

for (var x of Object.values(objet)) {
  console.log(x);        // 10
                         // 20
}

Itérer sur un tableau

for each...in pouvait être utilisée afin de parcourir les éléments d'un tableau.

Syntaxe dépréciée

var array = [10, 20, 30];

for each (var x in array) {
  console.log(x);        // 10
                         // 20
                         // 30
}

Syntaxe alternative, standard

On peut obtenir le même effet avec les boucles for...of (ES2015).

var array = [10, 20, 30];

for (var x of array) {
  console.log(x);        // 10
                         // 20
                         // 30
}

Parcourir un tableau qui vaille null ou undefined

for each...in ne fera rien si la valeur fournie est null ou undefined. En revanche, for...of lèvera une exception dans ces cas.

Syntaxe dépréciée

function func(array) {
  for each (var x in array) {
    console.log(x);
  }
}
func([10, 20]);        // 10
                       // 20
func(null);            // rien ne s'affiche
func(undefined);       // rien ne s'affiche

Syntaxe alternative, standard

Pour réécrire les instructions for each...in afin que les valeurs null ou undefined puissent être gérées avec for...of, il faudra rajouter une protection :

function func(array) {
  if (array) {
    for (var x of array) {
      console.log(x);
    }
  }
}
func([10, 20]);        // 10
                       // 20
func(null);            // rien ne s'affiche
func(undefined);       // rien ne s'affiche

Itérer sur les tuples clé-valeur d'un objet

Syntaxe dépréciée

On pouvait utiliser une forme syntaxique particulière, désormais dépréciée, qui combine for each...in et l'objet déprécié Iterator.

var object = { a: 10, b: 20 };

for each (var [key, value] in Iterator(object)) {
  console.log(key, value);  // "a", 10
                            // "b", 20
}

Syntaxe alternative, standard

On peut désormais utiliser la boucle for...in afin de parcourir les différentes clés d'un objet pour ensuite récupérer les valeurs associées :

var object = { a: 10, b: 20 };

for (var key in object) {
  var value = object[key];
  console.log(key, value);  // "a", 10
                            // "b", 20
}

Ou encore, on peut utiliser {jsxref("Instructions/for...of", "for...of")}} (ES2015) et Object.entries (ES2017) pour récupérer un tableau contenant les clés et les valeurs d'un objet qu'on pourra ensuite parcourir :

var object = { a: 10, b: 20 };

for (var [key, value] of Object.entries(object)) {
  console.log(key, value);  // "a", 10
                            // "b", 20
}

Voir aussi

Étiquettes et contributeurs liés au document

Étiquettes : 
 Contributeurs à cette page : SphinxKnight
 Dernière mise à jour par : SphinxKnight,