JavaScript forEach - Cara Melakukan Loop Melalui Array di JS

Metode JavaScript forEach adalah salah satu dari beberapa cara untuk melakukan perulangan melalui array. Setiap metode memiliki fitur yang berbeda, dan terserah Anda, tergantung pada apa yang Anda lakukan, untuk memutuskan metode mana yang akan digunakan.

Dalam posting ini, kita akan melihat lebih dekat metode JavaScript forEach.

Mengingat kami memiliki array berikut di bawah ini:

const numbers = [1, 2, 3, 4, 5];

Menggunakan "for loop" tradisional untuk melakukan loop melalui array akan seperti ini:

for (i = 0; i < numbers.length; i++) { console.log(numbers[i]); } 

Apa yang membuat metode forEach () berbeda?

Metode forEach juga digunakan untuk melakukan loop melalui array, tetapi metode ini menggunakan fungsi yang berbeda dari "for loop" klasik.

Metode forEach meneruskan fungsi callback untuk setiap elemen array bersama dengan parameter berikut:

  • Nilai Saat Ini (wajib) - Nilai elemen array saat ini
  • Indeks (opsional) - Nomor indeks elemen saat ini
  • Array (opsional) - Objek array yang memiliki elemen saat ini

Izinkan saya menjelaskan parameter ini selangkah demi selangkah.

Pertama, untuk melakukan loop melalui array dengan menggunakan metode forEach, Anda memerlukan fungsi callback (atau fungsi anonim):

numbers.forEach(function() { // code });

Fungsi tersebut akan dijalankan untuk setiap elemen array. Ini harus mengambil setidaknya satu parameter yang mewakili elemen dari sebuah array:

numbers.forEach(function(number) { console.log(number); });

Itu saja yang perlu kita lakukan untuk melakukan perulangan melalui array:

Atau, Anda dapat menggunakan representasi fungsi panah ES6 untuk menyederhanakan kode:

numbers.forEach(number => console.log(number));

Parameter Opsional

Indeks

Baiklah sekarang mari kita lanjutkan dengan parameter opsional. Yang pertama adalah parameter "indeks", yang mewakili nomor indeks dari setiap elemen.

Pada dasarnya, kita dapat melihat nomor indeks suatu elemen jika kita memasukkannya sebagai parameter kedua:

numbers.forEach((number, index) => { console.log('Index: ' + index + ' Value: ' + number); });

Himpunan

Parameter array adalah array itu sendiri. Ini juga opsional dan dapat digunakan jika perlu dalam berbagai operasi. Jika tidak, jika kita menyebutnya, itu hanya akan dicetak sebanyak jumlah elemen dari array:

numbers.forEach((number, index, array) => { console.log(array); });

Anda dapat melihat contoh penggunaan metode forEach () dalam video ini:

Dukungan Browser

Metode Array.forEach didukung di semua browser, mengharapkan IE versi 8 atau sebelumnya:

Jika Anda ingin mempelajari lebih lanjut tentang Pengembangan Web, silakan kunjungi Saluran Youtube saya.

Terima kasih telah membaca!