Vòng lặp dùng để thực thi một hành động lặp đi lặp lại. Bên cạnh đó, các bài toán từ đơn giản đến phức tạp, không bài nào là không bắt gặp vòng lặp. Nó xuất hiện ở mọi bài toán, mọi vấn đề. Trong bài viết này, mình sẽ đào sâu vào vòng lặp for trong Javascript.
Cũng như những ngôn ngữ lập trình khác, Javascript có rất nhiều cấu trúc lặp khác nhau while
, for
, do...while
,... Tuy nhiên, trong Javascript có cung cấp cho chúng ta 2 cấu trúc lặp rất đặc
biệt, có cú pháp ngắn gọn và dễ sử dụng. Đó chính là for...of
và for...in
.
Trước hết, chúng ta cùng xem lại cấu trúc của vòng lặp for và cách sử dụng của nó.
1. Vòng lặp for
Cú pháp
let i = 0 : khởi tạo biến cho vòng lặp
i < 10 : điều kiện để vòng lặp thực hiện
i++ : tăng giá trị biến chạy lên 1 mỗi khi thực hiện xong hành động
Bạn có thể bỏ trống giá trị ban đầu trong cú pháp của vòng lặp for
nếu trước đó đã gán giá trị của biến chạy
Bạn cũng có thể bỏ trống giá trị thứ hai trong cú pháp của vòng lặp for. Lúc này, nếu giá trị thứ hai trả về giá trị true
thì vòng lặp tiếp tục thực thi, nếu là false
thì
vòng lặp sẽ dừng lại.
Nếu bỏ trống giá trị thứ hai thì bắt buộc trong vòng lặp phải có lệnh break
, nếu không thì vòng lặp sẽ chạy mãi không dừng lại.
Giá trị thứ ba trong cú pháp vòng lặp for cũng không thực sự cần thiết nếu như bạn thay đổi giá trị của biến chạy trong vòng lặp.
Tuy nhiên, việc bỏ trống các giá trị trong cú pháp của vòng lặp for là không nên. Dù ngắn gọn nhưng nếu dùng không đúng lúc sẽ khiến code của chúng ta khó đọc lại.
Ví dụ
Kết quả in ra
Đoạn code trên là ví dụ của vòng lặp for trong Javascript, rất dễ sử dụng phải không nào. Nhưng cú pháp này khá dài, liệu có cách nào rút gọn hơn không ?
Câu trả lời là có. Như ở đầu bài mình có đề cập, chúng ta sẽ sử dụng for...of và for...in
2. Vòng lặp for...of
Vòng lặp này được ra mắt ở phiên bản ES6. Tương tự như for, vòng lặp này được sử dụng để duyệt từng phần tử của đối tượng duyệt. Số lượng lặp bằng với số phần tử của đối tượng.
Cú pháp
let student
: khai báo biến chạy
students
: một Array, String, Map, WeakMap, Set [không có Object]
Ví dụ
Giờ chúng ta sẽ thử vòng lặp for...of với ví dụ ở trên.
Kết quả
Và kết quả cũng giống như chúng ta sử dụng vòng lặp for nhưng có thể thấy cú pháp của for...of tường minh, dễ hiểu hơn là for.
Tuy nhiên for...of
không duyệt theo kiểu giảm dần giống như trong for được.
3. Vòng lặp for...in
Vòng lặp này thường được sử dụng với mục đích là lặp trong một object chứ không phải trong array hay string giống như hai vòng lặp trên. Số lượng lặp tương ứng với số thuộc tính của object mà ta duyệt.
Cú pháp
let key
: khai báo biến chạy
obj
: đối tượng duyệt [thường là object]
Ví dụ
Kết quả
Kết quả in ra là những thuộc tính của object
for...in
cũng có thể dùng với array
, lúc này các thuộc tính của mỗi phần từ trong array chính là index.
Kết quả
4. Lời khuyên
Đối với những người mới lập trình thì nên sử dụng vòng lặp for bình thường vì các biến chạy, điều kiện, tăng giảm biến chạy đều thực hiện trên cùng một dòng, do đó dễ dàng sửa lỗi.
- Không nên bỏ trống các giá trị trong cú pháp của vòng lặp for.
- Chỉ nên sử dụng vòng lặp for...in khi cần lặp qua object, không nên sử dụng với array.
- Vòng lặp for...of không dùng được với object.
Với những người đã quen với vòng lặp for thì nên sử dụng linh hoạt hai vòng lặp for...of và for...in, vì có thể sử dụng trong nhiều trường hợp và khiến cho code của chúng ta dễ đọc hơn. Bên cạnh đó, khi thao tác với kiểu dữ liệu JSONthì 2 vòng lặp này có thể duyệt dễ dàng.
Tạm kết
Trên đây là những kiến thức của mình với vòng lặp for trong Javascript. Hi vọng sẽ có ích với các bạn. Đừng ngần ngại để lại ý kiến đóng góp ở phần bình luận để kiến thức được hoàn chỉnh và sâu hơn nữa nhé các bạn. Cảm ơn các bạn.