Vòng lặp for trong JavaScript
Trần Thị Vân
- 1089
- 23/08/2025
Chức năng của Vòng lặp for trong JavaScript
Vòng lặp for trong JavaScript dùng để duyệt qua các giá trị trong một mảng hoặc đối tượng rồi lấy các giá trị hoặc khóa (key) của từng phần tử.
Code Vòng lặp for trong JavaScript
Vòng lặp for cơ bản trong JavaScript
<script>
for(let i=0;i<12;i++){
let thang = i+1;
document.write("Tháng "+thang+"<br>");
}
</script>
let i=0: khai báo biến i bằng 0.
i: điều kiện nếu biến i nhỏ hơn 12 thì tiếp tục chạy vòng lặp.
i++: mỗi vòng lặp thì i tăng lên 1.
Kết quả:
Tháng 1
Tháng 2
Tháng 3
Tháng 4
Tháng 5
Tháng 6
Tháng 7
Tháng 8
Tháng 9
Tháng 10
Tháng 11
Tháng 12
// for một mảng
document.write("<b>for một mảng</b><br>");
const mang = ["Lực", "Vân", "Quỳnh"];
for(let i=0; i< mang.length; i++){
var giatri = mang[i];
document.write(giatri+"<br>");
}
Kết quả:
Lực
Vân
Quỳnh
Vòng lặp for...in trong JavaScript
Dùng để lấy khóa (key) của một đối tượng và lấy giá trị của khóa (key):
<script>
let nhanvien1 = {ten: "Lực", tuoi: 35};
for (let key in nhanvien1) {
document.write(key+" "+nhanvien1[key]+"<br>");
}
</script>
Kết quả:
ten Lực
tuoi 35
Vòng lặp for...of trong JavaScript
Dùng để lặp một mảng, chuỗi, Set, Map,... sau đó có thể lấy giá trị hoặc khóa (key) của chúng:
<script>
var mang = ["Vân","Lực","Quỳnh"];
// Lấy giá trị của mảng
document.write("<b>Lấy giá trị của mảng</b><br>");
for (let value of mang) {
document.write(value+"<br>");
}
// Lấy giá trị, khóa(key) của mảng
document.write("<b>Lấy giá trị, khóa(key) của mảng</b><br>");
for (let [key, giatri] of mang.entries()) {
document.write("Vị trí "+key+": "+giatri+"<br>");
}
// Lặp một chuỗi
document.write("<b>Lặp một chuỗi</b><br>");
var chuoi = "webmoi0705";
for (let value of chuoi) {
document.write(value+"<br>");
}
</script>
Kết quả:
Lấy giá trị của mảng
Vân
Lực
Quỳnh
Lấy giá trị, khóa(key) của mảng
Vị trí 0: Vân
Vị trí 1: Lực
Vị trí 2: Quỳnh
Lặp một chuỗi
w
e
b
m
o
i
0
7
0
5
Khi nào nên dùng vòng lặp for trong JavaScript?
Không phải trường hợp nào cũng cần dùng cùng một kiểu vòng lặp. Việc chọn đúng loại giúp đoạn JavaScript dễ đọc, ít thao tác dư thừa và thể hiện rõ mục đích xử lý dữ liệu. Có thể dựa vào loại dữ liệu và cách bạn muốn truy cập phần tử để lựa chọn.
Dùng for khi cần kiểm soát vị trí và số lần lặp
Vòng lặp for phù hợp khi bạn biết hoặc có thể xác định điều kiện lặp, đồng thời cần chủ động kiểm soát biến đếm. Đây là lựa chọn thuận tiện khi cần làm việc với chỉ số của từng phần tử trong mảng.
const numbers = [10, 20, 30, 40];
for (let i = 0; i < numbers.length; i++) {
console.log(`Phần tử ${i}: ${numbers[i]}`);
}
Điểm mạnh của for là có thể dễ dàng thay đổi bước tăng, giới hạn lặp hoặc bỏ qua một số vị trí theo điều kiện riêng. Vì vậy, nó đặc biệt hữu ích khi quá trình duyệt dữ liệu phụ thuộc vào chỉ số.
Dùng for...in khi cần duyệt thuộc tính của đối tượng
for...in thích hợp khi mục tiêu là lần lượt lấy tên các thuộc tính của một đối tượng. Sau khi có tên thuộc tính, bạn có thể dùng nó để truy cập giá trị tương ứng.
const user = {
name: "An",
age: 25,
city: "Hà Nội"
};
for (const key in user) {
console.log(key, user[key]);
}
Kiểu vòng lặp này nên được ưu tiên cho đối tượng thay vì cố sử dụng for chỉ để lấy từng thuộc tính. Với mảng, for...in thường không phải lựa chọn phù hợp nếu bạn muốn duyệt các giá trị theo thứ tự.
Dùng for...of khi cần lấy trực tiếp giá trị phần tử
for...of phù hợp khi bạn chỉ quan tâm đến giá trị của từng phần tử trong một đối tượng có thể lặp, chẳng hạn như mảng hoặc chuỗi. Cách viết này giúp tránh phải quản lý chỉ số khi chỉ cần xử lý dữ liệu.
const products = ["Laptop", "Chuột", "Bàn phím"];
for (const product of products) {
console.log(product);
}
So với việc truy cập numbers[i] trong vòng lặp thông thường, for...of làm rõ ngay ý định: lấy lần lượt từng giá trị để xử lý. Đây thường là lựa chọn dễ đọc khi không cần biết vị trí của phần tử.
Lời kết
Cảm ơn các bạn đã tham khảo bài viết Vòng lặp for trong JavaScript.
- 0 Bình luận
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *