Obtenir un compteur/index de boucle en utilisant la syntaxe for of en JavaScript

Question

Attention :

La question s'applique toujours à for…of n'utilisez pas for…in pour itérer sur un Array et l'utiliser pour itérer sur le propriétés d'un objet. Cela dit, cette

---

Je comprends que la base for…in en JavaScript ressemble à ceci :

for (var obj in myArray) {
    // ...
}

Mais comment faire pour que la boucle compteur/index ?

Je sais que je pourrais probablement faire quelque chose comme :

var i = 0;
for (var obj in myArray) {
    alert(i)
    i++
}

Ou même le bon vieux :

for (var i = 0; i < myArray.length; i++) {
    var obj = myArray[i]
    alert(i)
}

Mais je préfère utiliser le plus simple for-in boucle. Je pense qu'ils sont plus beaux et plus logiques.

Existe-t-il un moyen plus simple ou plus élégant ?

---

En Python, c'est facile :

for i, obj in enumerate(myArray):
    print i

Answer 1

for…in itère sur les noms de propriétés, pas sur les valeurs, et le fait de cette manière dans un ordre indéterminé (oui, même après ES6). Vous ne devriez pas l'utiliser pour itérer sur des tableaux. Pour eux, il y a la méthode ES5 forEach qui transmet à la fois la valeur et l'indice à la fonction que vous lui donnez :

var myArray = [123, 15, 187, 32];

myArray.forEach(function (value, i) {
    console.log('%d: %s', i, value);
});

// Outputs:
// 0: 123
// 1: 15
// 2: 187
// 3: 32

Ou l'ES6 Array.prototype.entries qui prend désormais en charge toutes les versions actuelles des navigateurs :

for (const [i, value] of myArray.entries()) {
    console.log('%d: %s', i, value);
}

Pour les itérables en général (où vous utiliseriez un for…of plutôt qu'une boucle for…in ), il n'y a rien d'intégré, cependant :

function* enumerate(iterable) {
    let i = 0;

    for (const x of iterable) {
        yield [i, x];
        i++;
    }
}

for (const [i, obj] of enumerate(myArray)) {
    console.log(i, obj);
}

Démonstration%20%7B%0A%20%20%20%20console.log(i%2C%20obj)%3B%0A%7D)

Si vous voulez vraiment dire for…in - énumérer les propriétés - vous auriez besoin d'un compteur supplémentaire. Object.keys(obj).forEach pourrait fonctionner, mais il ne comprend que propre propriétés ; for…in comprend des propriétés énumérables n'importe où dans la chaîne des prototypes.

Answer 2

En ES6, il est bon d'utiliser une balise for... of boucle. Vous pouvez obtenir l'index dans for... of comme ceci

for (let [index, val] of array.entries()) {
  // your code goes here    
}

Notez que Array.entries() renvoie à un itérateur ce qui lui permet de fonctionner dans la boucle for-of ; ne pas confondre avec Objet.entries() qui renvoie un tableau de paires clé-valeur.

Answer 3

Que pensez-vous de ça ?

let numbers = [1,2,3,4,5]
numbers.forEach((number, index) => console.log(`${index}:${number}`))

Donde array.forEach cette méthode a un index qui est l'index de l'élément en cours de traitement dans le tableau.

Answer 4

Solution pour les petites collections de tableaux :

for (var obj in arr) {
    var i = Object.keys(arr).indexOf(obj);
}

arr - ARRAY, obj. - KEY de l'élément actuel, i - COMPTEUR/INDEX

Avis : Méthode clés() n'est pas disponible pour la version d'IE <9, vous devez utiliser Polyfill code. https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/keys

Answer 5

Les boucles For-in itèrent sur les propriétés d'un objet. Ne les utilisez pas pour les tableaux, même si elles fonctionnent parfois.

Les propriétés des objets n'ont donc pas d'index, elles sont toutes égales et ne doivent pas être parcourues dans un ordre déterminé. Si vous voulez compter les propriétés, vous devrez configurer un compteur supplémentaire (comme vous l'avez fait dans votre premier exemple).

boucle sur un tableau :

var a = [];
for (var i=0; i<a.length; i++) {
    i // is the index
    a[i] // is the item
}

boucle sur un objet :

var o = {};
for (var prop in o) {
    prop // is the property name
    o[prop] // is the property value - the item
}