JavaScript cho vòng lặp (Với 20 ví dụ) – vòng lặp for nâng cao trong javascript

vòng lặp for trong javascript là một câu lệnh luồng điều khiển được sử dụng để thực thi lặp đi lặp lại một khối mã cho đến khi một điều kiện nhất định là đúng.

Bạn đang xem : vòng lặp for nâng cao trong javascript

JavaScript For Loop – Hướng dẫn đầy đủ

Trong hướng dẫn này, bạn sẽ tìm hiểu vòng lặp trong JavaScript là gì, vòng lặp for là gì, cách sử dụng vòng lặp for. Chúng tôi cũng sẽ xem xét các loại vòng lặp khác nhau và sẽ bao gồm chi tiết vòng lặp ‘for’ với các ví dụ.

Vòng lặp là gì?

Vòng lặp là một câu lệnh luồng điều khiển được sử dụng để thực thi lặp đi lặp lại một khối mã cho đến khi điều kiện đưa ra trong vòng lặp là đúng.

Nói cách đơn giản, vòng lặp là một khối mã được thực thi lặp đi lặp lại cho đến khi một điều kiện được đáp ứng. Điều kiện được gọi là điều kiện lặp và nó được đưa ra trong vòng lặp.

Tại sao chúng ta sử dụng vòng lặp?

Việc sử dụng vòng lặp phổ biến nhất là lặp lại một khối mã một số lần.

Ví dụ: bạn có thể muốn in một tin nhắn nhiều lần. Bạn có thể sử dụng một vòng lặp để làm điều này.

Vòng lặp rất hữu ích trong khi lập trình, nó là một trong những tính năng được sử dụng nhiều nhất của bất kỳ ngôn ngữ lập trình nào.

ví dụ: nếu chúng tôi muốn in “Hello, World!” Sau đó 10 lần thay vì viết mã in trong 10 lần, chúng ta có thể sử dụng vòng lặp và viết mã một lần.

Đây là mã để in “Hello, World!” 10 lần.

Ví dụ

  for (var i = 0; i & lt; 10; i ++) {
  console.log ("Xin chào, Thế giới!");
}  

▶ Chạy mã

Các loại vòng lặp trong javascript

JavaScript có nhiều loại vòng lặp khác nhau. Đây là danh sách chúng.

< / p>

  • vòng lặp for : Vòng lặp lặp lại một khối mã trong một số lần được chỉ định
  • for … in : Vòng lặp lặp lại một khối mã cho từng thuộc tính của một đối tượng
  • for … of : Vòng lặp được sử dụng để lặp qua các vòng lặp có thể lặp lại như Mảng, Chuỗi, v.v.
  • while : Vòng lặp lặp lại một khối mã trong khi một điều kiện nhất định là đúng
  • do … while : Điều này cũng thực thi một khối mã cho đến khi một điều kiện nhất định là đúng nhưng nó thực thi khối mã ít nhất một lần

Vòng lặp for

trong JavaScript

Vòng lặp for là một trong những vòng lặp được sử dụng nhiều nhất trong JavaScript. Nó được sử dụng để lặp lại một khối mã với số lần xác định.

Cú pháp – vòng lặp for

Cú pháp của vòng lặp for như sau:

  for ([khởi tạo]; [điều kiện]; [Lặp lại]) {
  // mã ở đây
}  

vòng lặp for bao gồm 3 phần điều khiển:

  1. Khởi tạo : Khởi tạo là một phần của vòng lặp for nơi chúng tôi khởi tạo bộ đếm của vòng lặp for. Nó là nơi bắt đầu vòng lặp for. Ví dụ let i = 0
  2. Điều kiện : Phần điều kiện là một câu lệnh trả về true hoặc false , ví dụ: i & gt; 10 . nếu điều kiện là true thì khối mã của phần nội dung vòng lặp được thực thi, nếu điều kiện là false thì vòng lặp bị ngắt.
  3. Lặp lại : Trong phần này, bộ đếm của vòng lặp for được cập nhật. Ví dụ i ++ , i-- , i + = 2, v.v.

Hãy xem một vòng lặp for hoạt động.

Ví dụ

  for (var i = 0; i & lt; 5; i ++) {
  để tên = "John";
  console.log ("Chào" + tên);
}  
  • Khởi tạo

    : i = 0 đang khởi tạo thành 0

  • Điều kiện

    : i & lt; 5 đang kiểm tra xem 5 có lớn hơn

  • Lặp lại

    : i ++ đang tăng biến khởi tạo lên 1 trong mỗi lần lặp

Sơ đồ luồng – Cách hoạt động của vòng lặp for

Sơ đồ luồng bên dưới cho thấy luồng của vòng lặp for trong JavaScript.

Từ sơ đồ trên, bạn có thể thấy vòng lặp for thực thi mã theo thứ tự nào. Thứ tự thực hiện như sau:

< p class = "ezoic-ad banner-1 banner-1360 adtester-container adtester-container-360">

  1. vòng lặp for

    đầu tiên khởi tạo biến bộ đếm

  2. Sau đó, nó so sánh biến bộ đếm với điều kiện
  3. Nếu điều kiện là đúng thì nó thực thi khối mã của phần thân vòng lặp, sau đó cập nhật biến bộ đếm và việc thực thi quay trở lại bước 2
  4. Nếu điều kiện sai thì nó sẽ phá vỡ vòng lặp

Ví dụ – Đây là một ví dụ lặp qua một mảng và in từng phần tử.

Ví dụ

  var arr = [1, 2, 3, 4, 5];
for (var i = 0; i & lt; arr.length; i ++) {
  console.log (arr [i]);
}  

Sử dụng Biến Khởi tạo để có đầu ra linh hoạt

Biến khởi tạo (i trong ví dụ trên) được cập nhật sau mỗi lần lặp. Chúng tôi có thể sử dụng biến này trong phần nội dung vòng lặp để nhận được một số kết quả thú vị.

Giả sử bạn muốn in các số từ 1-10 hoặc bạn muốn tìm các ô vuông của mọi số từ 1-10, trong những trường hợp như vậy, biến khởi tạo có thể sử dụng.

Ví dụ 1 – In 0-10

Ví dụ

  for (var i = 1; i & lt; = 10; i ++) {
  console.log (i);
}  

Ví dụ 2 – Tìm bình phương của các số từ 1-10

Ví dụ

  for (var i = 1; i & lt; = 10; i ++) {
  console.log (i * i);
}  

lồng vào vòng lặp for trong javascript

Bạn có thể sử dụng vòng lặp for bên trong vòng lặp for khác. Đây được gọi là vòng lặp for lồng nhau.

Các vòng lặp lồng nhau rất hữu ích khi bạn muốn xem qua một danh sách các mục và sau đó thực hiện điều gì đó với từng mục. Ví dụ: bạn muốn lặp lại một danh sách các số và thực hiện một loạt các thao tác trên mỗi số.

Ví dụ về vòng lặp lồng nhau:

Ví dụ

  for (var i = 0; i & lt; 5; i ++) {
  for (var j = 0; j & lt; 5; j ++) {
    console.log (i + "" + j);
  }
}  

Một ví dụ khác để lặp qua một mảng các mảng.

Ví dụ

  let arr = [[1, "một", 2, "hai"], [3, "ba", 4, "bốn"]];
for (var i = 0; i & lt; arr.length; i ++) {
  for (var j = 0; j & lt; arr [i] .length; j ++) {
    console.log (arr [i] [j]);
  }
}  

 Ezoic

báo cáo quảng cáo này

Bây giờ hãy để chúng tôi xem một số tình huống mà bạn có thể nghĩ đến hoặc bạn có thể gặp phải khi làm việc với vòng lặp for. Chúng ta sẽ xem xét các tình huống sau:

  1. Khi bạn không khởi tạo biến bộ đếm
  2. Khi bạn để trống tình trạng của mình
  3. Khi bạn không cập nhật biến bộ đếm
  4. Khi bạn để trống tất cả (tức là khởi tạo, điều kiện và lặp lại)
  5. Khi bạn không sử dụng dấu ngoặc nhọn

Ví dụ 1 – Vòng lặp for lồng nhau không khởi tạo

Đây là tình huống mà bạn không khởi tạo biến bộ đếm. Trong trường hợp này, một lỗi sẽ được đưa ra nếu biến không được khởi tạo mà được sử dụng. Thông báo lỗi sẽ là ReferenceError: i không được xác định .

Vì vậy, bạn có thể để trống phần khởi tạo nhưng để sử dụng biến trong nội dung vòng lặp, bạn cần xác định biến này trước vòng lặp.

Ví dụ

  var i = 0;
cho (; i & lt; 5; i ++) {
  console.log (i);
}  

Ví dụ 2 – Vòng lặp for lồng nhau không có điều kiện

Đây là tình huống mà bạn không đưa ra bất kỳ điều kiện nào trong vòng lặp for. Trong trường hợp này, vòng lặp sẽ thực thi mãi mãi và sẽ không bao giờ bị phá vỡ.

Để ngắt vòng lặp, bạn cần đưa ra một điều kiện trong thân vòng lặp và ngắt vòng lặp khi điều kiện là đúng.

Ví dụ

  for (var i = 0;; i ++) {
  console.log (i);
  nếu (tôi == 5) {
    phá vỡ;
  }
}  

Lưu ý: câu lệnh break được sử dụng để ngắt vòng lặp. Chúng ta sẽ xem tuyên bố break chi tiết trong phần tới.

Ví dụ 3 – Vòng lặp for lồng nhau không lặp lại

Đây là tình huống mà bạn không đưa ra bất kỳ lần lặp nào trong vòng lặp for. Trong trường hợp này, vòng lặp sẽ thực thi mãi mãi và không bao giờ bị phá vỡ vì biến không được cập nhật và vẫn giữ nguyên.

Vì vậy, bạn có thể cập nhật biến đã khởi tạo trong khối mã.

Ví dụ

  for (var i = 0; i & lt; 5;) {
  console.log (i);
  i ++;
}  

Ví dụ 4 – Vòng lặp for lồng nhau không có khởi tạo, không có điều kiện và không lặp lại

Đây là tình huống mà bạn không đưa ra bất kỳ khởi tạo, điều kiện và lặp lại nào trong vòng lặp for. Trong trường hợp này, những điều sau có thể xảy ra:

  1. Nếu bất kỳ biến đã sử dụng nào không được xác định, sẽ có một lỗi xảy ra.
  2. Vòng lặp phải được cung cấp một số điều kiện để phá vỡ, nếu không, vòng lặp sẽ thực thi mãi mãi.
  3. Điều kiện bên trong khối mã phải ở trạng thái

    true

    . Nếu không, vòng lặp sẽ thực thi mãi mãi.

Vì vậy, bạn có thể để trống tất cả nhưng để sử dụng biến trong nội dung vòng lặp, bạn cần xác định biến đó trước vòng lặp.

Ví dụ

  // xác định một biến
var i = 0;
vì (; ; ) {
  console.log (i);
  if (i == 5) {// điều kiện
    phá vỡ;
  }
  // cập nhật biến
  i ++;
}  

Ví dụ 5 – Không có dấu ngoặc nhọn

Khi bạn chỉ có một dòng mã trong nội dung vòng lặp for, bạn có thể bỏ qua dấu ngoặc nhọn.

Nhưng nếu bạn có nhiều dòng mã, bạn cần sử dụng dấu ngoặc nhọn. Mã bên trong dấu ngoặc nhọn được biểu diễn dưới dạng một khối.

Ví dụ

  for (var i = 0; i & lt; 5; i ++)
  console.log (i);  

Hãy cùng tìm hiểu sơ lược về vòng lặp for … in và for … of. Chúng ta sẽ xem chúng chi tiết trong phần tới.

for … in loop

Vòng lặp for … in được sử dụng để lặp lại các thuộc tính của một đối tượng. Nó cũng được sử dụng để lặp qua một mảng.

Chúng tôi chưa thảo luận về đối tượng nhưng ở đây chúng tôi đang lấy một ví dụ đơn giản: tập trung vào vòng lặp ở đây thay vì đối tượng.

Cú pháp – for … in

Cú pháp của vòng lặp for … in như sau:

  for (var propertyName in object) {
  // làm việc gì đó
}  

propertyName là tên thuộc tính của đối tượng. Đối tượng là đối tượng có các thuộc tính sẽ được lặp lại.

Từ khóa in được sử dụng để lặp lại các thuộc tính của đối tượng.

Đây là một ví dụ:

Ví dụ

 var car = {
  tên: "ford",
  màu đen",
  mô hình: "mustang"
}

for (var prop in car) {// prop đại diện cho các thuộc tính của xe hơi
  console.log (`$ {prop} = $ {car [prop]}`);
}  

▶ Chạy mã

for … of loop javascript

Vòng lặp for … of được sử dụng để lặp qua các phần tử của một mảng. Nó cũng được sử dụng để lặp qua một đối tượng có thể lặp lại như mảng, chuỗi, NodeList, đối số, v.v.

Cú pháp – for … of

Cú pháp của vòng lặp for … of như sau:

  for (var phần tử của mảng) {
  // làm việc gì đó
}  

Phần tử là phần tử của mảng. Mảng là mảng có các phần tử sẽ được lặp lại.

Đây là một ví dụ:

Ví dụ

  var fruit = ["Apple", "Banana", "Carrot", "Guava", "Orange"];
for (var element of fruit) {
  console.log (phần tử);
}  

▶ Chạy mã

lặp qua Chuỗi bằng vòng lặp for … of

Ví dụ

  var moto = "Learn Javascript";
for (var char of moto) {// char là phần tử của moto
  console.log (char);
}  

▶ Chạy mã

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

Ví dụ 1: tổng các số từ 1 đến 10

Ví dụ

  var sum = 0;
for (var i = 1; i & lt; = 10; i ++) {
  tổng + = i;
}
console.log (sum);  

Ví dụ 2: Các số chẵn từ m đến n

Ví dụ

  var m = 10, n = 20;
for (var i = m; i & lt; = n; i ++) {
  nếu (i% 2 === 0) {
    console.log (i);
  }
}  

Ví dụ 3: các số nguyên tố từ 0 đến n

Ví dụ

  var n = 10;
for (var i = 2; i & lt; = n; i ++) {
  var isPrime = true;
  for (var j = 2; j & lt; = Math.sqrt (i); j ++) {// vòng lặp lồng nhau
    nếu (i% j === 0) {
      isPrime = false;
      phá vỡ;
    }
  }
  if (isPrime) {
    console.log (i);
  }
}  

Kết luận

Vòng lặp trong javascript được sử dụng để lặp qua các phần tử của một mảng, một đối tượng có thể lặp lại như mảng, chuỗi, NodeList, đối số, v.v.

Vòng lặp được sử dụng phổ biến nhất trong javascript là vòng lặp for.


Xem thêm những thông tin liên quan đến chủ đề vòng lặp for nâng cao trong javascript

Vòng lặp For

alt

  • Tác giả: F8 Official
  • Ngày đăng: 2020-01-16
  • Đánh giá: 4 ⭐ ( 6007 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Truy cập ngay https://f8.edu.vn và học tại đây để quản lý được tiến độ học và hơn thế nữa!

    hoclaptrinh javascript mienphi
    ———————————————-/————-
    © Bản quyền thuộc về MyCV.vn
    © Copyright by MyCV.vn ☞ Do not Reup

    Liên hệ: SƠN ĐẶNG
    ► Facebook: https://url.mycv.vn/sondn-fb?ref=yt
    ► Email: sondnf8@gmail.com
    —————————————
    ► Học lập trình: https://url.mycv.vn/f8?ref=yt
    ► Viết CV xin việc: https://url.mycv.vn/mycv?ref=yt
    —————————————
    HỌC LẬP TRÌNH MIỄN PHÍ
    ► Khóa Javascript cơ bản: https://url.mycv.vn/js-basic?ref=yt

05. Vòng lặp trong JavaScript

  • Tác giả: laptrinhcanban.com
  • Đánh giá: 3 ⭐ ( 6421 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Hướng dẫn sử dụng vòng lặp trong JavaScript. Vòng lặp trong JavaScript tuy đơn giản nhưng có vai trò vô cùng quan trọng khi xử lý chương trình JavaScript. Bạn sẽ học được cách sử dụng các lệnh lặp tro

Vòng lặp for trong JavaScript

  • Tác giả: hocjavascript.net
  • Đánh giá: 5 ⭐ ( 7875 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài viết này, mình sẽ giúp các bạn nắm rõ hơn về vòng lặp, cụ thể là vòng lặp For trong JavaScript nhé.

Bài tập vòng lặp for trong Javascript – Freetuts

  • Tác giả: sangtaotrongtamtay.vn
  • Đánh giá: 3 ⭐ ( 2979 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Bài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.

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

  • Tác giả: hanoiict.edu.vn
  • Đánh giá: 4 ⭐ ( 9439 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: 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. 5 Loại vòng lặp và JS cung cấp

Cách dùng vòng lặp for trong Javascript

  • Tác giả: mylop.edu.vn
  • Đánh giá: 5 ⭐ ( 3959 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài này chúng ta sẽ tìm hiểu vòng lặp for trong Javascript, đây là vòng lặp được sử dụng rất nhiều khi học lập trình Javascript căn bản.

Vòng lặp for trong JavaScript

  • Tác giả: hktsoft.com
  • Đánh giá: 5 ⭐ ( 9526 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  CSS cắt ngắn Văn bản bằng Dấu ba chấm (...) [Hướng dẫn 2020] - dấu chấm lửng css bọc văn bản