Giới thiệu

Nếu bạn đã gặp trường hợp sử dụng lặp lại nsố lần trong JavaScript, rất có thể bạn đã thử triển khai giải pháp bên dưới (đặc biệt là trong phản ứng, khi bạn cần kết xuất n lần phần tử JSX).

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

Mảng thưa thớt

Khi các mảng JavaScript được khởi tạo mà không có bất kỳ phần tử nào mà chỉ có độ dài, các phần tử ở tất cả các chỉ mục được điền bằng empty items.

Các phần tử này không thể lặp lại với một số phương thức lặp mảng như forEach, map, filterv.v. Các phần tử này sẽ bỏ qua các phần tử trống và chỉ lặp qua các phần tử không trống khác nếu có.

Ví dụ,

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 ]

Các mục trống được xử lý như undefinedtrong một số thao tác như for...ofvòng lặp, truy cập qua chỉ mục và ...toán tử trải rộng.

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

Các phương pháp trên rất hữu ích khi bạn cần lặp lại một số lần nhất định trong một câu lệnh, chẳng hạn như hiển thị một phần tử JSX nhiều lần trong React.

Đó là tất cả mọi người! Cảm ơn vì đã đọc.

Thêm nội dung tại PlainEnglish.io . Đăng ký nhận bản tin miễn phí hàng tuần của chúng tôi . Theo dõi chúng tôi trên Twitter , LinkedIn , YouTube và Discord . Quan tâm đến hacking tăng trưởng? Kiểm tra mạch .