JavaScript cho vòng lặp
Vòng lặp có thể thực thi một khối mã nhiều lần.
Vòng lặp JavaScript
Vòng lặp rất hữu ích nếu bạn muốn chạy đi chạy lại cùng một mã, mỗi lần có một giá trị khác nhau.
Thường thì đây là trường hợp khi làm việc với mảng:
Thay vì viết:
text += cars[0] + "<br>";
text += cars[1] + "<br>";
text += cars[2] + "<br>";
text += cars[3] + "<br>";
text += cars[4] + "<br>";
text += cars[5] + "<br>";
Bạn có thể viết:
for (let i = 0; i < cars.length; i++) {
text += cars[i] + "<br>";
} Hãy tự mình thử »Các loại vòng lặp khác nhau
JavaScript hỗ trợ các loại vòng lặp khác nhau:
-
for- lặp qua một khối mã một số lần -
for/in- lặp qua các thuộc tính của một đối tượng -
for/of- lặp qua các giá trị của một đối tượng có thể lặp lại -
while- lặp qua một khối mã trong khi điều kiện đã chỉ định là đúng -
do/while- cũng lặp qua một khối mã trong khi điều kiện được chỉ định là đúng
Vòng lặp For
Câu for tạo một vòng lặp với 3 biểu thức tùy chọn:
for ( expression 1 ; expression 2 ; expression 3 ) {
// code block to be executed
}
Biểu thức 1 được thực thi (một lần) trước khi thực thi khối mã.
Biểu thức 2 xác định điều kiện để thực thi khối mã.
Biểu thức 3 được thực thi (mọi lúc) sau khi khối mã được thực thi.
Từ ví dụ trên, bạn có thể đọc:
Biểu thức 1 đặt một biến trước khi vòng lặp bắt đầu (đặt i = 0).
Biểu thức 2 xác định điều kiện để vòng lặp chạy (i phải nhỏ hơn 5).
Biểu thức 3 tăng giá trị (i++) mỗi khi khối mã trong vòng lặp được thực thi.
Biểu thức 1
Thông thường bạn sẽ sử dụng biểu thức 1 để khởi tạo biến được sử dụng trong vòng lặp (gọi i = 0).
Đây không phải là luôn luôn như vậy. JavaScript không quan tâm. Biểu thức 1 là tùy chọn.
Bạn có thể bắt đầu nhiều giá trị trong biểu thức 1 (cách nhau bằng dấu phẩy):
Ví dụ
for (let i = 0, len = cars.length, text = ""; i < len; i++) {
text += cars[i] + "<br>";
} Hãy tự mình thử »Và bạn có thể bỏ qua biểu thức 1 (như khi giá trị của bạn được đặt trước khi vòng lặp bắt đầu):
Ví dụ
let i = 2;
let len = cars.length;
let text = "";
for (; i < len; i++) {
text += cars[i] + "<br>";
} Hãy tự mình thử »Biểu thức 2
Thường biểu thức 2 được sử dụng để đánh giá điều kiện của biến ban đầu.
Đây không phải là luôn luôn như vậy. JavaScript không quan tâm. Biểu thức 2 cũng là tùy chọn.
Nếu biểu thức 2 trả về true, vòng lặp sẽ bắt đầu lại. Nếu trả về false thì vòng lặp sẽ kết thúc.
Nếu bạn bỏ qua biểu thức 2, bạn phải cung cấp dấu ngắt bên trong vòng lặp. Nếu không vòng lặp sẽ không bao giờ kết thúc. Điều này sẽ làm hỏng trình duyệt của bạn. Đọc về các khoảng nghỉ ở chương sau của hướng dẫn này.
Biểu thức 3
Thường biểu thức 3 tăng giá trị của biến ban đầu.
Đây không phải là luôn luôn như vậy. JavaScript không quan tâm. Biểu thức 3 là tùy chọn.
Biểu thức 3 có thể thực hiện bất kỳ điều gì như số tăng âm (i--), số tăng dương (i = i + 15) hoặc bất cứ điều gì khác.
Biểu thức 3 cũng có thể được bỏ qua (như khi bạn tăng giá trị bên trong vòng lặp):
Ví dụ
let i = 0;
let len = cars.length;
let text = "";
for (; i < len; ) {
text += cars[i] + "<br>";
i++;
} Hãy tự mình thử »Phạm vi vòng lặp
Sử dụng var trong một vòng lặp:
Sử dụng let trong một vòng lặp:
Trong ví dụ đầu tiên, sử dụng var , biến được khai báo trong vòng lặp sẽ khai báo lại biến bên ngoài vòng lặp.
Trong ví dụ thứ hai, sử dụng let , biến được khai báo trong vòng lặp không khai báo lại biến bên ngoài vòng lặp.
Khi let được sử dụng để khai báo biến i trong vòng lặp, biến i sẽ chỉ hiển thị trong vòng lặp.
Vòng lặp For/Of và For/In
Vòng lặp for/in và vòng lặp for/of được giải thích trong chương tiếp theo.
Vòng lặp while
Vòng lặp while và do/while sẽ được giải thích trong các chương tiếp theo.
