Làm cách nào để lặp lại mảng phần tử trong html bằng javascript?

Lặp qua một mảng JavaScript là một trong những điều thường xuyên nhất mà một lập trình viên sẽ làm. Một mảng có thể bao gồm nhiều mục nhập dữ liệu và bạn có thể muốn thực hiện một tác vụ trên tất cả các mục nhập dữ liệu. Ví dụ: bạn có một dãy số mà bạn muốn tính tổng của chúng hoặc bạn có một mảng đối tượng và bạn muốn thêm một thuộc tính cho tất cả các đối tượng này. Có một số cách để lặp lại một mảng trong JavaScript. Hãy cùng xem và tìm ra cái tối ưu cho bạn

Vòng lặp for cổ điển và nổi tiếng lặp qua bất kỳ dải số tùy chỉnh nào bạn chỉ định và chạy một khối mã trên mỗi lần lặp. Bất cứ khi nào bạn muốn lặp qua một mảng, cách đơn giản là có một vòng lặp for lặp qua các khóa của mảng, nghĩa là lặp qua 0 độ dài của mảng

Mảng Javascript cho vòng lặp

hãy mảng = [1, 2, 3, 4, 5]; . chiều dài; . nhật ký (mảng [i]);

Vòng lặp for sử dụng 3 biểu thức

1. Khởi tạo - khởi tạo biến vòng lặp với giá trị bắt đầu chỉ có thể được thực hiện một lần
2. Điều kiện - chỉ định tình huống theo đó vòng lặp sẽ bị dừng
3. Biểu thức cuối cùng - được thực hiện ở cuối mỗi lần thực hiện vòng lặp. Nó được sử dụng để tăng chỉ số

cho. trong các vòng lặp thông qua các thuộc tính của một đối tượng. Đây là một trong những phương pháp đơn giản và được sử dụng nhiều nhất để lặp lại các đối tượng. Bạn định nghĩa một biến như i trong for (let i in arr), và trong mỗi lần lặp lại, biến i sẽ trở thành bằng với một khóa trong arr. Sau đó, bạn sẽ có thể chọn phần tử mảng mong muốn bằng thứ gì đó như arr[i]. Xem một ví dụ dưới đây

Mảng Javascript cho. trong vòng lặp

đặt tên = ["John", "Jack", "Alice"]; . nhật ký (tên [i]);

Nếu bạn muốn truy cập trực tiếp các giá trị bên trong một mảng chứ không phải các khóa, thì bạn nên sử dụng for. thay vì cho. Trong

Vòng lặp trong khi Javascript

đặt tên = ["John", "Jack", "Alice"]; . nhật ký (i);

Cái này hơi phức tạp. Mỗi mảng có một phương thức entry() trả về một lần lặp của cả khóa và giá trị của một mảng. sử dụng cho. of với phương pháp này cho phép chúng tôi lặp lại cả khóa và giá trị

Vòng lặp trong khi Javascript

const name = ["John", "Jack", "Alice"]; . mục()) { bảng điều khiển. nhật ký (`phím. ${key}, giá trị. ${giá trị}`);

Các vòng lặp trong khi thông qua một khối mã miễn là một điều kiện được chỉ định là đúng

Cách lặp qua một mảng trong JavaScript

cho i = 0; . nhật ký (i);

Trong ví dụ đã cho, mã trong vòng lặp sẽ chạy đi chạy lại, miễn là biến i nhỏ hơn 10

Bạn có thể sử dụng break và continue trong vòng lặp while. Nhưng khi bạn sử dụng vòng lặp while, bạn nên tính đến số gia tăng cho lần lặp tiếp theo. Nếu không, nó có thể dẫn đến một vòng lặp vô hạn

Một giải pháp thay thế cho vòng lặp for và for/in isArray. nguyên mẫu. cho mỗi(). forEach() chạy một hàm trên mỗi phần tử được lập chỉ mục trong một mảng. Bắt đầu từ chỉ mục[0], một hàm sẽ được gọi trên chỉ mục[0], chỉ mục[1], chỉ mục[2], v.v… forEach() sẽ cho phép bạn lặp qua một mảng gần giống như vòng lặp for

Vòng lặp trong khi Javascript

để mảng = [{ id. 1, tên. 'John', tuổi. 12 }, { id. 2, tên. 'Jane', tuổi. 14 }, { id. 3, tên. 'Martin', tuổi. 13 }, { id. 4, tên. 'Katie', tuổi. 17 }, { id. 5, tên. 'Louis', tuổi. 11 } ]; . forEach(function (profile, index, arr) { console. nhật ký (`Chỉ mục. ${index}, tên. ${hồ sơ. tên}`);

Như bạn đã thấy, phương thức forEach() lấy một hàm làm đối số đầu vào và áp dụng hàm đó cho từng phần tử của mảng theo cách tuần tự. Cũng lưu ý rằng hàm nhận làm tham số đầu vào không được phép trả về giá trị, do đó không thể được coi là hàm thuần túy

Phương thức tạo một mảng mới với kết quả gọi hàm cho từng phần tử mảng. Trong ví dụ bên dưới, chúng tôi xác định một mảng có tên myFirstArray, sau đó nhân mỗi phần tử với 2 và lưu kết quả vào một mảng mới có tên mySecondArray. Hãy thử mã và bạn sẽ nhận thấy rằng mảng đầu tiên không thay đổi

Cách lặp qua một mảng trong JavaScript

const myFirstArray = [2, 3, 5, 7]; . bản đồ(el => el * 2); . log('----myFirstArray----'); . nhật ký (myFirstArray); . log('----mySecondArray----'); . nhật ký (mySecondArray);

Thoạt nhìn, phương thức map() có điểm tương đồng với phương thức forEach() vì nó cũng sẽ gọi hàm gọi lại một lần cho mỗi phần tử mảng. Sự khác biệt là map() tạo và trả về các mảng mới dựa trên kết quả của hàm gọi lại

Làm cách nào để lặp mảng trong JavaScript sang HTML?

Làm cách nào để lặp lại các phần tử HTML trong JavaScript?

Làm cách nào để lấy từng phần tử của một mảng trong JavaScript?

Làm cách nào để duyệt qua mảng trong JavaScript?