# JavaScript - Vòng Lặp for...in: Hướng Dẫn Dành Cho Người Mới Bắt Đầu
Xin chào các bạn đang học lập trình! Hôm nay, chúng ta sẽ cùng nhau khám phá một trong những công cụ hữu ích của JavaScript: vòng lặp `for...in`. Đừng lo lắng nếu bạn chưa từng viết mã trước đây - tôi sẽ hướng dẫn bạn từng bước, như tôi đã làm với hàng trăm học viên trong những năm dạy học của mình. Vậy, hãy lấy một tách cà phê (hoặc trà, nếu bạn thích), và chúng ta cùng bắt đầu nhé!
## Vòng Lặp for...in Là Gì?
Trước khi chúng ta đi vào chi tiết, hãy hiểu về vòng lặp `for...in`. Hãy tưởng tượng bạn có một hộp lớn đầy đồ chơi (chúng ta sẽ gọi hộp này là một "đối tượng" trong JavaScript). Vòng lặp `for...in` giống như một bàn tay kỳ diệu len vào hộp và lấy ra một món đồ chơi mỗi lần, cho phép bạn nhìn kỹ từng món đồ.
Trong lập trình, vòng lặp `for...in` cho phép chúng ta duyệt qua các thuộc tính của một đối tượng. Đây là cách để chúng ta kiểm tra từng piece của dữ liệu lưu trữ trong một đối tượng, một cách từng phần.
## Cú Pháp của Vòng Lặp for...in
Bây giờ, hãy cùng xem cách chúng ta viết vòng lặp `for...in`. Đừng lo nếu nó trông có vẻ lạ lẫm ban đầu - chúng ta sẽ phân tích nó cùng nhau!
```javascript
for (let key in object) {
// mã cần thực thi
}
Hãy phân tích điều này:
-
for
: Từ khóa này báo cho JavaScript biết rằng chúng ta đang bắt đầu một vòng lặp. -
let key
: Đây tạo ra một biến (chúng ta gọi nó làkey
ở đây) sẽ giữ tên của mỗi thuộc tính khi chúng ta duyệt qua đối tượng. -
in
: Từ khóa này phân tách tên biến từ đối tượng mà chúng ta đang vòng lặp qua. -
object
: Đây là đối tượng mà chúng ta muốn kiểm tra. - Dấu ngoặc
{}
chứa mã sẽ chạy cho mỗi thuộc tính trong đối tượng.
Ví Dụ về Vòng Lặp for...in Trong Thực Tế
Ví Dụ 1: Khám Phá Một Đối Tượng Đơn Giản
Hãy bắt đầu với một ví dụ đơn giản. Hãy tưởng tượng chúng ta có một đối tượng đại diện cho một cuốn sách:
let book = {
title: "The Great Gatsby",
author: "F. Scott Fitzgerald",
year: 1925
};
for (let property in book) {
console.log(property + ": " + book[property]);
}
Nếu chúng ta chạy đoạn mã này, đây là những gì chúng ta sẽ thấy trong console:
title: The Great Gatsby
author: F. Scott Fitzgerald
year: 1925
Điều gì đang xảy ra ở đây? Vòng lặp for...in
của chúng ta đang duyệt qua mỗi thuộc tính của đối tượng book
. Mỗi lần lặp:
-
property
giữ tên của thuộc tính hiện tại ("title", "author", hoặc "year"). -
book[property]
cho chúng ta giá trị của thuộc tính đó. - Chúng ta sử dụng
console.log()
để in ra cả tên thuộc tính và giá trị của nó.
Ví Dụ 2: Đếm Số Lượng Thuộc Tính
Hãy设想一下如果我们想要计算一个对象有多少个属性:
let car = {
make: "Toyota",
model: "Corolla",
year: 2020,
color: "blue"
};
let propertyCount = 0;
for (let prop in car) {
propertyCount++;
}
console.log("The car object has " + propertyCount + " properties.");
Điều này sẽ выводить: "The car object has 4 properties."
Trong ví dụ này, chúng ta sử dụng vòng lặp for...in
để duyệt qua mỗi thuộc tính của đối tượng car
. Thay vì làm bất cứ điều gì với các thuộc tính đó, chúng ta chỉ đơn giản là tăng một bộ đếm mỗi khi vòng lặp chạy. Điều này cho chúng ta biết tổng số thuộc tính trong đối tượng.
Ví Dụ 3: Lọc Các Thuộc Tính
Đôi khi, bạn có thể muốn làm điều gì đó chỉ với một số thuộc tính nhất định. Hãy xem một ví dụ:
let person = {
name: "Alice",
age: 30,
city: "New York",
job: "Engineer",
hobby: "painting"
};
console.log("Properties that start with 'j':");
for (let prop in person) {
if (prop.startsWith('j')) {
console.log(prop + ": " + person[prop]);
}
}
Điều này sẽ выводить:
Properties that start with 'j':
job: Engineer
Trong ví dụ này, chúng ta sử dụng vòng lặp for...in
để duyệt qua tất cả các thuộc tính của đối tượng person
, nhưng chúng ta chỉ ghi các thuộc tính bắt đầu bằng chữ cái 'j'. Chúng ta sử dụng phương thức startsWith()
để kiểm tra điều kiện này.
Các Phương Thức Thường Dùng Cùng Với Vòng Lặp for...in
Dưới đây là bảng một số phương thức phổ biến mà bạn có thể sử dụng cùng với vòng lặp for...in
:
Phương Thức | Mô Tả | Ví Dụ |
---|---|---|
hasOwnProperty() |
Kiểm tra xem thuộc tính có trực tiếp trên đối tượng (không kế thừa) | if (object.hasOwnProperty(property)) |
Object.keys() |
Trả về một mảng các tên thuộc tính có thể đếm được của đối tượng | Object.keys(object) |
Object.values() |
Trả về một mảng các giá trị thuộc tính có thể đếm được của đối tượng | Object.values(object) |
Object.entries() |
Trả về một mảng các cặp [tên thuộc tính, giá trị] của thuộc tính có thể đếm được của đối tượng | Object.entries(object) |
Kết Luận
Và thế là bạn đã bước những bước đầu tiên vào thế giới của vòng lặp for...in
. Nhớ rằng, giống như việc học骑自行车, lập trình cần phải thực hành. Đừng nản lòng nếu nó không ngay lập tức hiểu được - hãy tiếp tục thử nghiệm với các đối tượng khác nhau và xem bạn có thể làm gì với vòng lặp for...in
.
Như chúng ta thường nói trong thế giới lập trình, "唯一的学习编程的方法就是编程!" Vậy, tại sao không thử tạo ra một đối tượng đại diện cho bộ phim hoặc cuốn sách yêu thích của bạn và xem bạn có thể làm gì với nó?
Chúc các bạn may mắn và nhớ - mỗi chuyên gia đều từng là người mới bắt đầu. Hãy tiếp tục kiên trì, và trước khi bạn biết điều đó, bạn sẽ vòng lặp qua các đối tượng như một chuyên gia!
Credits: Image by storyset