Hướng dẫn why we use nested for loop in javascript? - tại sao chúng ta sử dụng vòng lặp for lồng nhau trong javascript?

Question

Nếu bạn đang gặp khó khăn trong việc tìm hiểu thử thách làm tổ của Freecodecamp cho các vòng lặp, đừng lo lắng. Chúng tôi đã trở lại của bạn.

Nội dung chính Show

Thiết lập các vòng function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { console.log(arr[i]); } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 2 của bạn
Vòng qua các mảng bên trong
Vòng qua các phần tử trong mỗi mảng con
Xem kỹ hơn
Việc sử dụng các vòng lặp lồng nhau trong JavaScript là gì?
Tại sao chúng ta sử dụng lồng nhau cho vòng lặp?
Tại sao nó được gọi là vòng lặp lồng nhau?
Làm thế nào để lồng cho vòng lặp hoạt động?

Trong vấn đề này, bạn phải hoàn thành hàm

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

7 và lấy một mảng đa chiều làm đối số. Hãy nhớ rằng một mảng đa chiều, đôi khi được gọi là mảng 2D, chỉ là một mảng mảng, ví dụ,

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

8.

Trong trình chỉnh sửa bên phải,

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

7 được định nghĩa như sau:

function multiplyAll(arr) {
  var product = 1;
  // Only change code below this line

  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

Bạn cần hoàn thành chức năng để nó nhân biến

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

0 với mỗi số trong các phần phụ của tham số

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

1, đây là một mảng đa chiều.

Có rất nhiều cách khác nhau để giải quyết vấn đề này, nhưng chúng tôi sẽ tập trung vào phương pháp đơn giản nhất bằng cách sử dụng các vòng lặp

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2.

Thiết lập các vòng function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { console.log(arr[i]); } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 2 của bạn

Bởi vì

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

1 là một mảng đa chiều, bạn sẽ cần hai vòng

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2: một vòng lặp qua mỗi mảng mảng con và một vòng khác để lặp qua các phần tử trong mỗi mảng con.

Vòng qua các mảng bên trong

Để làm điều này, hãy thiết lập một vòng lặp

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 như bạn đã thực hiện trong các thử thách trước đây:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

Lưu ý rằng chúng tôi đang sử dụng

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

7 thay vì

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

8 cho vòng lặp và khai báo

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

0. Trong thử thách này, bạn sẽ không nhận thấy sự khác biệt giữa hai người, nhưng nói chung, việc sử dụng

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

0 và

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

7 của ES6 là tốt bất cứ khi nào bạn có thể. Bạn có thể đọc thêm về lý do tại sao trong bài viết này.

Bây giờ hãy đăng nhập từng phần phụ vào bảng điều khiển:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

Bởi vì bạn đang gọi

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

7 với

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

3 ở phía dưới, bạn sẽ thấy những điều sau đây:

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

Vòng qua các phần tử trong mỗi mảng con

Bây giờ bạn cần lặp qua từng số trong các mạng phụ, bạn vừa đăng nhập vào bảng điều khiển.

Xóa

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

4 và tạo vòng lặp

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 khác bên trong của cái bạn vừa viết:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

Hãy nhớ rằng, đối với vòng lặp bên trong, chúng ta cần kiểm tra

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

6 của

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

7 vì

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

7 là một trong những mép con mà chúng tôi đã xem xét trước đó.

Bây giờ đăng nhập

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

9 vào bảng điều khiển để xem từng phần tử riêng lẻ:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      console.log(arr[i][j]);
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

Cuối cùng, nhân

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

0 với mỗi phần tử trong mỗi phần phụ:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      product *= arr[i][j];
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

Nếu bạn đăng nhập

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

0 vào bảng điều khiển, bạn sẽ thấy câu trả lời chính xác cho từng trường hợp kiểm tra:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      product *= arr[i][j];
    }
  }
  // Only change code above this line
  console.log(product);
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

6  // [[1], [2], [3]]
5040  // [[1, 2], [3, 4], [5, 6, 7]]
54  // [[5, 1], [0.2, 4, 0.5], [3, 9]]

Xem kỹ hơn

Nếu bạn vẫn không chắc tại sao mã trên hoạt động, đừng lo lắng - bạn không đơn độc. Làm việc với các vòng lặp lồng nhau là phức tạp, và thậm chí các nhà phát triển có kinh nghiệm cũng có thể bị nhầm lẫn.

Trong các trường hợp như thế này, nó có thể hữu ích để đăng nhập một cái gì đó chi tiết hơn vào bảng điều khiển. Quay trở lại mã của bạn và đăng nhập

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 vào bảng điều khiển ngay trước vòng

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 bên trong:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

0

Trong vòng lặp

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 bên ngoài, mỗi lần lặp đi qua các mảng con trong

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

1. Bạn sẽ thấy điều này trong bảng điều khiển:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

1

Lưu ý rằng chúng tôi đang sử dụng các mẫu chữ ở trên.

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 giống như

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

7, dễ dàng hơn nhiều để viết.

Bây giờ trong vòng lặp

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 bên trong, đăng nhập

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

9 vào bảng điều khiển:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2

Vòng lặp

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 bên trong đi qua từng phần tử trong mỗi mảng con (

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

7), vì vậy bạn sẽ thấy điều này trong bảng điều khiển:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

3

Lần lặp đầu tiên của

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      console.log(arr[i][j]);
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 lấy thân con đầu tiên,

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      console.log(arr[i][j]);
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

3. Sau đó, lần lặp đầu tiên của

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      console.log(arr[i][j]);
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

4 đi qua từng phần tử trong mép con đó:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

4

Ví dụ này khá đơn giản, nhưng

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

9 vẫn có thể khó hiểu mà không đăng nhập nhiều thứ vào bảng điều khiển.

Một cải tiến nhanh chóng mà chúng tôi có thể thực hiện là khai báo biến

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      console.log(arr[i][j]);
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

6 ở vòng

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

2 bên ngoài và đặt nó bằng

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

7:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

5

Sau đó, chỉ cần thực hiện một vài điều chỉnh cho mã để sử dụng biến

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].length; j++) {
      console.log(arr[i][j]);
    }
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

6 mới thay vì

[ 1, 2 ]
[ 3, 4 ]
[ 5, 6, 7 ]

7:

function multiplyAll(arr) {
  let product = 1;
  // Only change code below this line
  for (let i = 0; i < arr.length; i++) {
    
  }
  // Only change code above this line
  return product;
}

multiplyAll([[1,2],[3,4],[5,6,7]]);

6

Đó phải là tất cả mọi thứ bạn cần biết về các mảng đa chiều và các vòng lặp ____22 lồng nhau. Bây giờ hãy ra khỏi đó và lặp lại với những người giỏi nhất!

Học mã miễn phí. Chương trình giảng dạy nguồn mở của Freecodecamp đã giúp hơn 40.000 người có được việc làm với tư cách là nhà phát triển. Bắt đầu

Việc sử dụng các vòng lặp lồng nhau trong JavaScript là gì?

Mã bên trong A For Loop có thể là bất kỳ mã nào có thể chạy bên ngoài vòng lặp, điều đó có nghĩa là bạn có thể sử dụng một vòng lặp bên trong vòng lặp khác. Lưu ý: Sử dụng các tên biến bộ đếm khác nhau (I và J) trong các vòng lặp lồng nhau.. Note: use different counter variable names ( i and j ) in nested loops.

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

Các vòng lặp lồng nhau rất hữu ích khi đối với mỗi lần đi qua vòng lặp bên ngoài, bạn cần lặp lại một số hành động trên dữ liệu ở vòng lặp bên ngoài.Ví dụ: bạn đã đọc một dòng tệp từng dòng và cho mỗi dòng, bạn phải đếm số lần từ trong số đó được tìm thấy.for each pass through the outer loop, you need to repeat some action on the data in the outer loop. For example, you read a file line by line and for each line you must count how many times the word “the” is found.

Tại sao nó được gọi là vòng lặp lồng nhau?

Một vòng lặp lồng có nghĩa là một câu lệnh vòng lặp bên trong một câu lệnh LOOP khác.Đó là lý do tại sao các vòng lặp lồng nhau còn được gọi là vòng lặp bên trong các vòng lặp.Chúng ta có thể xác định bất kỳ số lượng vòng lặp bên trong vòng lặp khác.a loop statement inside another loop statement. That is why nested loops are also called “loop inside loops“. We can define any number of loops inside another loop.

Làm thế nào để lồng cho vòng lặp hoạt động?

Khi một vòng lặp được lồng bên trong một vòng lặp khác, vòng bên trong chạy nhiều lần bên trong vòng ngoài.Trong mỗi lần lặp của vòng ngoài, vòng bên trong sẽ được bắt đầu lại.Vòng lặp bên trong phải hoàn thành tất cả các lần lặp của nó trước khi vòng ngoài có thể tiếp tục đến lần lặp tiếp theo.. In each iteration of the outer loop, the inner loop will be re-started. The inner loop must finish all of its iterations before the outer loop can continue to its next iteration.

programming javascript Nested for loop