pengantar

Jika Anda menemukan kasus penggunaan iterasi nbeberapa kali dalam JavaScript, kemungkinan besar, Anda mungkin telah mencoba mengimplementasikan solusi di bawah ini (terutama dalam reaksi, ketika Anda perlu merender elemen JSX n beberapa kali).

Array(5).map(() => console.log("hello"))

Array Jarang

Ketika larik JavaScript dibuat tanpa elemen apa pun tetapi hanya dengan panjang, elemen di semua indeks diisi dengan empty items.

Elemen-elemen ini tidak dapat diubah dengan beberapa metode iterasi array seperti forEach, map, filter, dll. Elemen-elemen ini akan melewati elemen kosong dan hanya mengulangi elemen lain yang tidak kosong jika ada.

Sebagai contoh,

const arr = Array(5);

console.log(arr); // [ <5 empty items> ]

arr[1] = 1;
arr[3] = 3;
arr[5] = 5;

console.log(arr); // [ <1 empty item>, 1, <1 empty item>, 3, <1 empty item>, 5 ]

arr.forEach((ele) => console.log(ele)); // 1, 3, 5

const arr = [1, 2, 3];

arr.length = 5;

console.log(arr); // [ 1, 2, 3, <2 empty items> ]

arr[7] = 8;

console.log(arr); // [ 1, 2, 3, <4 empty items>, 8 ]

arr.forEach((ele) => console.log(ele)); // 1, 2, 3, 8

delete arr[1];

console.log(arr); // [ 1, <1 empty item>, 3, <4 empty items>, 8 ]

const newArr = [1, , 2, , 3];

console.log(newArr); // [ 1, <1 empty item>, 2, <1 empty item>, 3 ]

Item kosong diperlakukan seperti undefineddalam beberapa operasi seperti loop, mengakses melalui indeks, dan operator for...ofspread ....

const arr = [1, , 2, , 3];

for (const ele of arr) { // 1, undefined, 2, undefined, 3, undefined
  console.log(ele);
}

console.log(...arr); // 1, undefined, 2, undefined, 3, undefined

console.log(arr[0]); // 1
console.log(arr[1]); // undefined

[...Array(3)].map((e) => console.log(e)); // undefined, undefined, undefined

Array.from({ length: 3 }).map((e) => console.log(e)); // undefined, undefined, undefined

Metode di atas berguna saat Anda perlu melakukan iterasi beberapa kali dalam satu pernyataan, seperti merender elemen JSX beberapa kali dalam React.

Itu semua orang! Terima kasih sudah membaca.

Lebih banyak konten di PlainEnglish.io . Mendaftar untuk buletin mingguan gratis kami . Ikuti kami di Twitter , LinkedIn , YouTube , dan Discord . Tertarik dengan Peretasan Pertumbuhan? Lihat Sirkuit .