Vòng lặp for trong JavaScript - Fedu

CHÀO MỪNG BẠN ĐẾN VỚI THƯ VIỆN HỌC TẬP & ĐÀO TẠO CƠ BẢN

Vòng lặp for trong JavaScript

JavaScript

Hướng dẫn JavaScript

Biểu mẫu JavaScript

Đối tượng JavaScript

Hàm JavaScript

DOM JavaScript

Trình duyệt BOM

JavaScript Ajax

JavaScript Json

Lệnh Loops có thể thực hiện một khối mã nhiều lần.

Vòng lặp JavaScript

Loops khá tiện dụng, nếu bạn muốn chạy cùng một mã lặp đi lặp lại, mỗi lần có một giá trị khác. Thông thường lệnh này thích 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 (i = 0; i < cars.length; i++) {
text += cars[i] + “<br>”;
}

Các loại Loops khác nhau

JavaScript hỗ trợ các loại vòng lặp khác nhau:

  • for – vòng lặp khối mã một số lần
  • for/in – vòng lặp qua các thuộc tính của đối tượng
  • while – vòng lặp qua một khối mã trong khi một điều kiện quy định là đúng
  • do/while – also loops through a block of code while a specified condition is true

Vòng lặp for

Vòng lặp for thường là công cụ bạn sẽ sử dụng khi bạn muốn tạo một vòng lặp. Cú pháp:

for (statement 1; statement 2; statement 3) {
code block to be executed
}

Câu lệnh 1 được thực hiện trước khi vòng lặp (khối mã) bắt đầu.

Câu lệnh 2 xác định điều kiện để chạy vòng lặp (khối mã).

Câu lệnh 3 được thực hiện mỗi lần sau khi vòng lặp (khối mã) đã được thực thi.

Ví dụ:

for (i = 0; i < 5; i++) {
text += “The number is ” + i + “<br>”;
}

Từ ví dụ trên, bạn có thể đọc:

Câu lệnh 1 thiết lập một biến trước khi bắt đầu vòng lặp (var i = 0).

Câu lệnh 2 xác định điều kiện cho vòng chạy (tôi phải nhỏ hơn 5).

Câu lệnh 3 làm tăng giá trị (i ++) mỗi lần khối mã trong vòng lặp đã được thực thi.

Câu lệnh 1

Thông thường, bạn sẽ sử dụng câu lệnh 1 để khởi tạo biến được sử dụng trong vòng lặp (i = 0). Câu lệnh 1 là tùy chọn. Bạn có thể bắt đầu nhiều giá trị trong câu lệnh 1 (cách nhau bằng dấu phẩy):

for (i = 0, len = cars.length, text = “”; i < len; i++) {
text += cars[i] + “<br>”;
}

Và bạn có thể bỏ qua câu lệnh 1 (như khi các giá trị của bạn được đặt trước khi bắt đầu vòng lặp):

var i = 2;
var len = cars.length;
var text = “”;
for (; i < len; i++) {
text += cars[i] + “<br>”;
}

Câu lệnh 2

Thông thường câu lệnh 2 được dùng để đánh giá tình trạng của biến ban đầu. Câu lệnh 2 cũng là tùy chọn. Nếu câu lệnh 2 trả về true, vòng lặp sẽ bắt đầu lại, nếu nó trả về false, vòng lặp sẽ kết thúc.

Nếu bạn bỏ qua câu lệnh 2, bạn phải cung cấp một break bên trong vòng lặp. Nếu không vòng lặp sẽ không bao giờ kết thúc. Thao tác này sẽ làm hỏng trình duyệt của bạn.

Câu lệnh 3

Thông thường câu lệnh 3 tăng giá trị của biến ban đầu. Câu lệnh 3 là tùy chọn. Câu lệnh 3 có thể làm bất cứ điều gì như giảm giá trị (i –), tăng thêm giá trị (i = i +15), hoặc bất cứ điều gì khác.

var i = 0;
var len = cars.length;
for (; i < len; ) {
text += cars[i] + “<br>”;
i++;
}

Vòng lặp for/in

Lệnh for/in trong JavaScript lặp lại thông qua các thuộc tính của một đối tượng:

var person = {fname:”John”, lname:”Doe”, age:25};

var text = “”;
var x;
for (x in person) {
text += person[x];
}