Döngü için ES6 dizi öğesi dizinine erişim

Bir for-of loop kullanarak dizi öğelerine erişebiliriz:

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

Geçerli dizine erişmek için bu kodu nasıl değiştirebilirim? Bunu forhe sözdizimi kullanarak başarmak istiyorum, ne forhe ne de for-in.

Kullanım Array.prototype.keys:

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

Hem anahtara hem de değere erişmek istiyorsanız, yıkımArray.prototype.entries() ile kullanabilirsiniz :

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

Array#entries ikisine de ihtiyacınız varsa dizini ve değeri döndürür:

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

}

Bu gösterişli yeni yerel işlevler dünyasında, bazen temelleri unutuyoruz.

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

Temiz, verimli ve yine breakde döngü yapabilirsiniz . Bonus! Ayrıca sondan başlayıp geriye doğru gidebilirsiniz i--!

Ek not: Döngü içinde çok fazla değer kullanıyorsanız, const value = arr[i];kolay ve okunabilir bir referans için döngünün üstünde yapmak isteyebilirsiniz .

html / js bağlamında, modern tarayıcılarda, Dizilerden farklı yinelenebilir nesnelerle [Tekrarlanabilir] .entries () de kullanabiliriz:

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

    element.innerHTML = '#' + index

}

Bir for..ofdöngüde bunu elde edebiliriz array.entries(). array.entriesyeni bir Array iterator nesnesi döndürür. Bir yineleyici nesnesi, öğelerin o sıradaki mevcut konumunu izlerken, aynı anda yinelenebilir bir öğeden nasıl erişileceğini bilir.

Tüm next()yöntem yineleyici anahtar değer çiftleri olarak adlandırılır oluşturulur. Bu anahtar / değer çiftlerinde dizi dizini anahtar ve dizi öğesi değerdir.

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

Bir for..ofdöngü temelde bir yinelenebilir tüketen ve tüm elemanlar (kaputun altında bir yineleyici kullanarak) ilmekler. Bunu array.entries()şu şekilde birleştirebiliriz :

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);
}

Sen gerekiyorsa Ayrıca indeksi kendinizi işleyebilir endeksi , Bunu gerek işin eğer anahtarı .

let i = 0;
for (const item of iterableItems) {
  // do something with index
  console.log(i);

  i++;
}

Bir Arraydizi veya hatta dizi benzeri olmayan nesneler kullananlar için, kendi yinelenebilirinizi kolayca oluşturabilirsiniz, böylece yine de sadece aşağıdakilere sahip olan for ofşeyler için kullanabilirsiniz :localStoragelength

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;
}

Sonra sadece bir numara verin:

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

ES6 for...in

for(const index in [15, 64, 78]) {                        
    console.log(index);
}

Başka bir yaklaşım Array.prototype.forEach(),

Array.from({
  length: 5
}, () => Math.floor(Math.random() * 5)).forEach((val, index) => {
  console.log(val, index)
})

var fruits = ["apple","pear","peach"];
for (fruit of fruits) {
    console.log(fruits.indexOf(fruit));
    //it shows the index of every fruit from fruits
}

for loop diziyi geçerken, indexof özelliği diziyle eşleşen dizinin değerini alır. PD bu yöntemin bazı kusurları vardır, bu yüzden meyve kullanın