5 Loại Vòng lặp trong JavaScript

Trong bài viết này các bạn sẽ học được viết chương trình để lặp lại một hành động cụ thể bằng Vòng lặp trong JavaScript.

Tóm Tắt

5 Loại vòng lặp của JavaScript

Bạn đang đọc: 5 Loại Vòng lặp trong JavaScript

5 loại vòng lặp trong JavaScript

Các vòng lặp được sử dụng để thực thi cùng một khối mã lặp đi lặp lại, miễn là một điều kiện nhất định được đáp ứng.

Ý tưởng cơ bản đằng sau một vòng lặp là :

Tự động hóa những trách nhiệm lặp đi lặp lại trong một chương trình để tiết kiệm ngân sách và chi phí thời hạn và công sức của con người .

JavaScript hiện tương hỗ 5 loại vòng lặp khác nhau :

+ while – vòng lặp while lặp lại một khối mã miễn là điều kiện được chỉ định đánh giá là đúng.

+ do…while – vòng lặp do…while lặp khối mã một lần. Sau đó đánh giá điều kiện. Nếu điều kiện là đúng, lặp lại khối mã miễn là điều kiện là đúng.

+ for – vòng lặp thông qua một khối mã cho đến khi bộ đếm đạt đến một số được chỉ định.

+ for…in – Vòng lặp for…in lặp qua thuộc tính của một đối tượng.

+ for…of – Vòng lặp for…of lặp các đối tượng có thể lặp như mảng, chuỗi, v.v.

Trong những phần sau, tất cả chúng ta sẽ bàn luận cụ thể từng câu lệnh lặp trong Javascript .

> Các loại vòng lặp trong PHP hay Java cũng có chung concept là lặp lại một khối mã để tối ưu hóa code.

#1. Vòng lặp while trong JavaScript

Vòng lặp while là câu lệnh lặp đơn giản nhất được cung cấp bởi JavaScript.

+ Vòng lặp while lặp qua một khối mã miễn là điều kiện được chỉ định đánh giá là đúng.

+ Ngay khi điều kiện kèm theo thất bại, vòng lặp dừng lại .

Cú pháp của vòng lặp while là:

while(Điều kiện) {
    // Mã thực thi
}

Ví dụ sử dụng vòng lặp while

Ví dụ sau định nghĩa một vòng lặp while, vòng lặp này sẽ liên tục chạy miễn là biến i nhỏ hơn hoặc bằng 5 .

Biến i sẽ tăng thêm 1 mỗi lần vòng lặp chạy :

var i = 1;
while(i <= 5) {    
    document.write("Số i là : " + i + "");
    i++;
}

Lưu ý : Đảm bảo rằng điều kiện kèm theo được chỉ định trong vòng lặp của bạn ở đầu cuối sẽ sai. Nếu bạn không thiết lập điều kiện kèm theo để sai. Vòng lặp while sẽ không dừng lại ( lặp vô hạn ). Một lỗi phổ cập là quên tăng biến đếm ( biến i sau mỗi lần lặp ) .

Kết quả :

Số i là: 1 Số i là: 2 Số i là: 3 Số i là: 4 Số i là: 5

#2. Vòng lặp do...while trong JavaScript

Vòng lặp do-while là một biến thể của vòng lặp while, đánh giá điều kiện ở cuối mỗi lần lặp của vòng lặp.

Với vòng lặp do-while:

+ Khối mã được thực thi một lần .
+ Sau đó nhìn nhận điều kiện kèm theo, nếu điều kiện kèm theo là đúng, câu lệnh được lặp lại miễn là điều kiện kèm theo được chỉ định được nhìn nhận là đúng .

Cú pháp của vòng lặp do-while là:

do {
    // Mã thực thi
}
while(Điều kiện);

Ví dụ sử dụng vòng lặp do-while

Đoạn mã JavaScript trong ví dụ sau định nghĩa một vòng lặp khởi đầu bằng i = 1 .

Sau đó, nó sẽ in tác dụng và tăng giá trị của biến i lên 1 .

Sau đó, điều kiện kèm theo được ước tính và vòng lặp sẽ liên tục chạy miễn là biến i nhỏ hơn hoặc bằng 5 .

var i = 1;
do {
    document.write("Số i là : " + i + "");
    i++;
}
while(i <= 5);

Kết quả :

Số i là: 1 Số i là: 2 Số i là: 3 Số i là: 4 Số i là: 5

Bạn có thấy tác dụng của 2 chương trình vừa qua giống nhau không ?

Vậy, ...

Sự khác biệt giữa vòng lặp while và vòng lặp do ... while là gì?

Vòng lặp while khác với vòng lặp do-while theo như sau:

Với vòng lặp while, điều kiện cần đánh giá được kiểm tra ở đầu mỗi vòng lặp.

Do đó, nếu biểu thức điều kiện kèm theo ước đạt thành false, vòng lặp sẽ không khi nào được thực thi .

Mặt khác, với vòng lặp do-while, vòng lặp sẽ luôn được thực thi một lần ngay cả khi biểu thức điều kiện kèm theo ước tính thành false .

Vì không giống như vòng lặp while, điều kiện kèm theo được nhìn nhận ở cuối vòng lặp thay vì trước khi khởi đầu lặp .

#3. Vòng lặp for trong JavaScript

Vòng lặp for trong JS lặp lại một khối mã miễn là một điều kiện nhất định được đáp ứng.

Nó thường được sử dụng để thực thi một khối mã trong một số ít lần nhất định ( bạn đã biết trước số lần lặp này ) .

Xem thêm: Cách xóa tài khoản Gmail vĩnh viễn trên máy tính, điện thoại đơn giản

Cú pháp của vòng lặp for trong JS là :

for(initialization; condition; increment) {
    // Code to be executed
}

Các tham số của câu lệnh for có ý nghĩa sau:

+ initialization - khởi tạo, nó được sử dụng để khởi tạo các biến đếm và được đánh giá một lần vô điều kiện trước khi thực hiện đầu tiên của phần thân của vòng lặp.

+ condition - điều kiện, nó được đánh giá ở đầu mỗi lần lặp. Nếu nó đánh giá là đúng, các câu lệnh lặp thực thi. Nếu nó ước tính thành false, việc thực hiện vòng lặp kết thúc.

+ increment - nó cập nhật bộ đếm vòng lặp với một giá trị mới mỗi khi vòng lặp chạy.

Ví dụ về vòng lặp for trong JS

Ví dụ sau định nghĩa một vòng lặp khởi đầu bằng i = 1 .

Vòng lặp sẽ liên tục cho đến khi giá trị của biến i nhỏ hơn hoặc bằng 5 .

Biến i sẽ tăng thêm 1 mỗi lần vòng lặp chạy :

for(var i = 1; i <= 5; i++) {
    document.write("Số i là : " + i + "");
}

Kết quả :

Số i là: 1 Số i là: 2 Số i là: 3 Số i là: 4 Số i là: 5

Vòng lặp for đặc biệt hữu ích cho việc lặp qua một mảng trong JavaScript.

Ví dụ sau sẽ chỉ cho bạn cách in từng item hoặc thành phần của mảng JavaScript .

// Một mảng trong JavaScript
var hoaQua= ["Táo", "Chuối", "Xoài", "Cam", "Lựu"];
 
// Lặp qua các phần tử trong mảng
for(var i = 0; i < hoaQua.length; i++) {
    document.write("" + hoaQua [ i ] + "");
}

Kết quả :

Táo Chuối Xoài Cam Lựu

#4. Vòng lặp for...in trong JavaScript

Vòng lặp for-in là một loại vòng lặp đặc biệt lặp lại các thuộc tính của một đối tượng hoặc các phần tử của một mảng.

Cú pháp của vòng lặp for ... in là :

for(variable in object) {
    // Mã thực thi
}

Bộ đếm vòng lặp, tức là biến trong vòng lặp for-in là một chuỗi, không phải là một số ít .

Nó chứa tên của thuộc tính hiện tại hoặc chỉ mục của thành phần mảng hiện tại .

Ví dụ về vòng lặp for...in trong JS

Ví dụ sau sẽ chỉ cho bạn cách lặp qua tổng thể những thuộc tính của đối tượng người tiêu dùng JavaScript .

// Một đối tượng 
var person = {"Tên": "Doanh", "Họ": "Vi", "Tuổi": "36"};
 
// Lặp qua tất cả các thuộc tính
for(var x in person) {  
    document.write("" + x + " = " + person [ x ] + ""); 
}

Kết quả :

Tên : Doanh Họ : Vi Tuổi : 36

Tương tự, bạn hoàn toàn có thể lặp qua những thành phần của một mảng bằng vòng lặp for-in, như sau :

// Một mảng chứa các phần tử
var hoaQua= ["Táo", "Chuối", "Xoài", "Cam", "Lựu"];
 
// Lặp qua tất cả các phần tử
for(var i in hoaQua) {  
    document.write("" + hoaQua [ i ] + "");
}

Kết quả :

Táo Chuối Xoài Cam Lựu

Lưu ý : Không nên sử dụng vòng lặp for-in để lặp qua một mảng nếu mảng đó quan trọng thứ tự chỉ mục. Bạn nên sử dụng một vòng lặp for với chỉ mục dạng số .

#5. Vòng lặp for...of trong JavaScript (ES6)

ES6 giới thiệu một vòng lặp for-of mới cho phép chúng ta lặp lại qua các mảng hoặc các đối tượng lặp khác (ví dụ: chuỗi) rất dễ dàng.

Ngoài ra, mã bên trong vòng lặp được thực thi cho từng thành phần của đối tượng người tiêu dùng lặp .

Ví dụ sau đây sẽ cho bạn thấy cách lặp qua các mảng và chuỗi bằng vòng lặp for...of này.

// Tạo một mảng chuẩn bị để lặp
let letters = ["a", "b", "c", "d", "e", "f"];

for(let letter of letters) {
    console.log(letter); // a,b,c,d,e,f
}

// Lặp qua một chuỗi
let greet = "Hello World!";

for(let character of greet) {
    console.log(character); // H,e,l,l,o, ,W,o,r,l,d,!
}

Lưu ý : Vòng lặp for ... of không hoạt động giải trí với những đối tượng người dùng vì chúng không hề lặp lại. Nếu bạn muốn lặp lại những thuộc tính của một đối tượng người tiêu dùng, bạn hoàn toàn có thể sử dụng vòng lặp for-in .

Chúc mừng bạn đã biết sử dụng 5 loại vòng lặp trong JavaScript

Như vậy là qua bài viết này các bạn đã được với thiệu về cú pháp và cách sử dụng 5 loại vòng lặp trong JavaScript.

Chúng ta sẽ còn sử dụng vòng lặp của JavaScript trong các bài tiếp theo, vì thế, hãy xem lại kỹ cách các vòng lặp hoạt động nhé.

> Tham khảo: Khóa học nghệ thuật Front end trực tuyến

---
HỌC VIỆN ĐÀO TẠO CNTT NIIT - ICT HÀ NỘI
Dạy học Lập trình chất lượng cao ( Since 2002 ). Học làm Lập trình viên. Hành động ngay !
Đc : Tầng 3, 25T2, N05, Nguyễn Thị Thập, CG cầu giấy, Thành Phố Hà Nội
SĐT : 02435574074 - 0914939543 - 0353655150
E-Mail : [email protected]
Website : https://niithanoi.edu.vn
Fanpage : https://facebook.com/NIIT.ICT/

#niit #niithanoi #niiticthanoi #hoclaptrinh #khoahoclaptrinh #hoclaptrinhjava #hoclaptrinhphp #java #php #python

Xem thêm: Cách xóa tài khoản Gmail vĩnh viễn trên máy tính, điện thoại đơn giản

Source: https://final-blade.com
Category: Kiến thức Internet

admin

final-blade.com