wake-up-neo.com

Zugriff auf den ES6-Arrayelementindex innerhalb der for-of-Schleife

Wir können auf Array-Elemente über eine for-of-Schleife zugreifen:

for (const j of [1, 2, 3, 4, 5]) {
  console.log(j);
}

Wie kann ich diesen Code ändern, um auch auf den aktuellen Index zuzugreifen? Ich möchte dies mit der for-of-Syntax erreichen, weder forEach noch for-in.

javascriptecmascript-6for-of-loop
153
Abdennour TOUMI

Verwenden Sie Array.prototype.keys :

for (const index of [1, 2, 3, 4, 5].keys()) {
  console.log(index);
}

Wenn Sie auf den Schlüssel und den Wert zugreifen möchten, können Sie Array.prototype.entries() mit destructuring verwenden:

for (const [index, value] of [1, 2, 3, 4, 5].entries()) {
  console.log(index, value);
}

229
Michał Perłakowski

Array#entries gibt den Index und den Wert zurück, wenn Sie beide benötigen:

for (let [index, value] of array.entries()) {

}
246
Felix Kling

In dieser Welt der auffälligen neuen nativen Funktionen vergessen wir manchmal die Grundlagen.

for (let i = 0; i < arr.length; i++) {
    console.log('index:', i, 'element:', arr[i]);
}

Sauber, effizient, und Sie können die Schleife noch break. Bonus! Sie können auch am Ende beginnen und mit i-- rückwärts gehen!

12
chris

in HTML/Js-Kontext, in modernen Browsern, mit anderen iterierbaren Objekten als Arrays könnten wir auch [Iterable] .entries () verwenden:

for(let [index, element] of document.querySelectorAll('div').entries()) {

    element.innerHTML = '#' + index

}
2
Joseph Merdrignac

In einer for..of-Schleife können wir dies über array.entries() erreichen. array.entries gibt ein neues Array-Iteratorobjekt zurück. Ein Iterator-Objekt weiß, wie auf Elemente von einem iterierbaren Objekt zugegriffen werden kann, während es seine aktuelle Position innerhalb dieser Sequenz verfolgt.

Wenn die next()-Methode für den Iterator aufgerufen wird, werden Schlüsselwertpaare generiert. In diesen Schlüsselwertpaaren ist das Array index der Schlüssel und das Arrayelement der Wert. 

let arr = ['a', 'b', 'c'];
let iterator = arr.entries();
console.log(iterator.next().value); // [0, 'a']
console.log(iterator.next().value); // [1, 'b']

Eine for..of-Schleife ist im Grunde ein Konstrukt, das eine Iteration verbraucht und alle Elemente durchläuft (unter Verwendung eines Iterators unter der Haube). Wir können dies mit array.entries() auf folgende Weise kombinieren:

array = ['a', 'b', 'c'];

for (let indexValue of array.entries()) {
  console.log(indexValue);
}


// we can use array destructuring to conveniently
// store the index and value in variables
for (let [index, value] of array.entries()) {
   console.log(index, value);
}

1
Willem van der Veen

es6 for...in

for(const index in [15, 64, 78]) {                        
    console.log(index);
}
0
solanki...
var fruits = ["Apple","pear","Peach"];
for (fruit of fruits) {
    console.log(fruits.indexOf(fruit));
    //it shows the index of every fruit from fruits
}

die for-Schleife durchläuft das Array, während die Eigenschaft indexof den Wert des Index annimmt, der dem Array entspricht

0
Edwin Felipe

Für diejenigen, die Objekte verwenden, die keine Array- oder gar Array-ähnliche sind, können Sie leicht eigene Iterationen erstellen, sodass Sie for of noch für Dinge wie localStorage verwenden können, die wirklich nur eine length haben:

function indexerator(length) {
    var output = new Object();
    var index = 0;
    output[Symbol.iterator] = function() {
        return {next:function() {
            return (index < length) ? {value:index++} : {done:true};
        }};
    };
    return output;
}

Dann füttern Sie einfach eine Nummer:

for (let index of indexerator(localStorage.length))
    console.log(localStorage.key(index))
0
Hashbrown