Hướng dẫn dùng foreach r python

Trong JavaScript, để duyệt array thì forEach là một hàm rất hay. Vậy hàm forEach trong JavaScript cụ thể là như thế nào? Cách sử dụng forEach JavaScript ra sao? Mình hãy cùng tìm hiểu để làm chủ forEach js nhé!

Hướng dẫn dùng foreach r python

Đặt bài toán

Cho một mảng

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
4. Hãy tính tổng các số trong mảng và hiển thị ra console.

Khi mới học JavaScript, mình giải bài toán này như sau:

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55

Cách giải trên khá dễ hiểu. Mình duyệt tất cả các phần tử mảng bằng vòng lặp for với chỉ số. Tại mỗi lượt lặp, mình lấy phần tử đang duyệt cộng dồn với biến

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
5.

Có một vấn đề với cách này, đó là việc sử dụng chỉ số

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
6 có thể khiến bạn bị nhầm với một biến trước đó. Dẫn đến những lỗi sai không đoán trước được.

Lúc này, forEach JavaScript xuất hiện giúp bạn giải quyết vấn đề trên.

Cách triển khai hàm forEach JavaScript

Một cách đơn giản để triển khai hàm forEach như sau:

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}

Hàm

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7 trên nhận đầu vào là một mảng
arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
8 và một hàm
arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
9 - thực hiện hành động với mỗi phần tử của mảng
arr.forEach(function(currentValue, index, array) { // code xử lý
  }[, thisArg]);
0.

Áp dụng hàm forEach để giải quyết bài toán trên

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55

Mình có thể diễn giải thuật toán trên bằng lới như sau: Với mỗi phần tử trong mảng

arr.forEach(function(currentValue, index, array) { // code xử lý
  }[, thisArg]);
1, mình lấy nó ra và cộng dồn với biến sum. Kết quả thu được, sẽ ghi ra console.

Nếu so sánh với cách làm trước thì cách này rõ ràng là dài hơn. Tuy nhiên, đây chỉ là một ví dụ cơ bản, nên mình sẽ không bàn về độ dài, ngắn của code.

Vấn đề nên quan tâm trước tiên đó là: code-đọc-dễ-hiểu.

Theo quan điểm cá nhân mình, việc sử dụng hàm forEach giúp code gần giống với ngôn ngữ tự nhiên hơn. Quan điểm của bạn về vấn đề này thế nào?

Giới thiệu hàm forEach trong JavaScript

Hàm forEach là gì? Hay vòng lặp forEach trong JavaScript là gì?

Trả lời: forEach là một phương thức có sẵn của array, để duyệt qua mỗi phần tử của mảng và thực hiện một hành động nào đó.

Cú pháp

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);

Giải thích

  • arr.forEach(function(currentValue, index, array) { // code xử lý
      }[, thisArg]);
    
    2: Hàm callback là hàm để thực hiện với mỗi phần tử của mảng, bao gồm 3 tham số:
    • arr.forEach(function(currentValue, index, array) { // code xử lý
        }[, thisArg]);
      
      3: phần tử hiện tại đang được xử lý của array.
    • arr.forEach(function(currentValue, index, array) { // code xử lý
        }[, thisArg]);
      
      4: chỉ số của phần tử hiện tại đang được xử lý của array.
    • arr.forEach(function callback(currentValue, index, array) {
        // code xử lý
      }[, thisArg]);
      
      8: mảng hiện tại đang gọi hàm forEach.
  • arr.forEach(function(currentValue, index, array) { // code xử lý
      }[, thisArg]);
    
    6: giá trị được sử dụng như là
    arr.forEach(function(currentValue, index, array) { // code xử lý
      }[, thisArg]);
    
    7 - tham chiếu tới đối tượng khi thực hiện hàm
    arr.forEach(function(currentValue, index, array) { // code xử lý
      }[, thisArg]);
    
    2.

Chú ý:

  • Nếu
    arr.forEach(function(currentValue, index, array) { // code xử lý
      }[, thisArg]);
    
    6 bị bỏ qua thì mặc định giá trị đó là
    function printContentArray(array) {
      array.forEach(function print(element) {
        console.log(element);
      });
    }
    
    printContentArray([1, 3, 5]);
    
    0.
  • Bạn có thể bỏ qua tên hàm
    arr.forEach(function(currentValue, index, array) { // code xử lý
      }[, thisArg]);
    
    2.

arr.forEach(function(currentValue, index, array) { // code xử lý
  }[, thisArg]);

Ví dụ in ra nội dung của mảng

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);

Kết quả

1

3

5

Ví dụ sử dụng arr.forEach(function(currentValue, index, array) { // code xử lý }[, thisArg]); 6

function Counter() {
      this.sum = 0;
      this.count = 0;

      this.add = function(array) {
        array.forEach(function(item) {
          this.sum += item;
          ++this.count;
        }, this); // this chính là đối tượng tạo new Counter  }
    }

    const obj = new Counter();
    obj.add([2, 5, 9]);

    console.log(obj.count); // 3
    console.log(obj.sum); // 16

Ưu, nhược điểm của việc sử dụng forEach

Bất cứ thứ gì cũng có hai mặt, forEach JavaScript cũng không ngoại lệ. Sau đây là một số ưu, nhược điểm của phương thức

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7:

Ưu điểm

  • Code rõ ràng, gần với ngôn ngữ tự nhiên.
  • Trong nhiều trường hợp sẽ ngắn gọn hơn việc sử dụng vòng lặp
    function printContentArray(array) {
      array.forEach(function print(element) {
        console.log(element);
      });
    }
    
    printContentArray([1, 3, 5]);
    
    4 hay
    function printContentArray(array) {
      array.forEach(function print(element) {
        console.log(element);
      });
    }
    
    printContentArray([1, 3, 5]);
    
    5.

Nhược điểm

  • Code thường sẽ chạy chậm hơn so với việc sử dụng vòng lặp (tuy nhiên không đáng kể).
  • Không giống các ngôn ngữ lập trình khác như C/C++, Java (hầu như chỉ sử dụng vòng lặp).

Trên đây là một số ưu, nhược điểm của việc sử dụng

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7. Mình không khuyên bạn nên hay không nên sử dụng phương thức này.

Đây chỉ đơn giản là một cách thức để duyệt mảng, bạn có thể sử dụng nó hoặc bạn chỉ cần sử dụng vòng lặp.

It's the choice.

Một số từ khóa trong vòng lặp forEach JS

Khi so sánh với các vòng lặp khác, ngôn ngữ lập trình khác, bạn sẽ thấy một số từ khóa hay sử dụng trong vòng lặp như:

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
7,
function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
8 và
function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
9.

Câu hỏi đặt ra là liệu những từ khóa này có sử dụng được trong vòng lặp forEach JavaScript hay không? Cách sử dụng của chúng có giống hay không?

Sau đây là câu trả lời.

Từ khóa return trong forEach

Từ khóa

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
7 dùng để dừng lại một hàm và trả về giá trị từ hàm đó.

Giả sử, bạn cần viết một hàm tìm vị trí của số chẵn đầu tiên trong một mảng. Nếu không tìm thấy thì trả về giá trị

function Counter() {
      this.sum = 0;
      this.count = 0;

      this.add = function(array) {
        array.forEach(function(item) {
          this.sum += item;
          ++this.count;
        }, this); // this chính là đối tượng tạo new Counter  }
    }

    const obj = new Counter();
    obj.add([2, 5, 9]);

    console.log(obj.count); // 3
    console.log(obj.sum); // 16
1.

Sau đây là code sử dụng vòng lặp for thông thường:

function findFirstEvenIndex(arr) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1

Chuyển đoạn code trên sang forEach như sau:

function findFirstEvenIndex(arr) {
  arr.forEach(function (item, i) {
    if (arr[i] % 2 === 0) return i;
  });

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", -1);
// ret= -1

Tại sao kết quả lại là -1?

Tại vì từ khóa

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
7 trong forEach chỉ có tác dụng để thoát khỏi hàm callback bên trong forEach mà thôi. Do đó, kết quả của hàm trên là giá trị của câu lệnh
function Counter() {
      this.sum = 0;
      this.count = 0;

      this.add = function(array) {
        array.forEach(function(item) {
          this.sum += item;
          ++this.count;
        }, this); // this chính là đối tượng tạo new Counter  }
    }

    const obj = new Counter();
    obj.add([2, 5, 9]);

    console.log(obj.count); // 3
    console.log(obj.sum); // 16
3 cuối cùng.

Dể giải quyết bài toán này, mình khuyên bạn không nên dùng

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7. Thay vào đó bạn có thể dùng vòng lặp for thông thường như trên, hoặc sử dụng vòng lặp for...in như sau:

function findFirstEvenIndex(arr) {
  for (let i in arr) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1

vòng lặp

function Counter() {
      this.sum = 0;
      this.count = 0;

      this.add = function(array) {
        array.forEach(function(item) {
          this.sum += item;
          ++this.count;
        }, this); // this chính là đối tượng tạo new Counter  }
    }

    const obj = new Counter();
    obj.add([2, 5, 9]);

    console.log(obj.count); // 3
    console.log(obj.sum); // 16
5 chỉ nên dùng với array, không nên sử dụng với đối tượng
function Counter() {
      this.sum = 0;
      this.count = 0;

      this.add = function(array) {
        array.forEach(function(item) {
          this.sum += item;
          ++this.count;
        }, this); // this chính là đối tượng tạo new Counter  }
    }

    const obj = new Counter();
    obj.add([2, 5, 9]);

    console.log(obj.count); // 3
    console.log(obj.sum); // 16
6.

Từ khóa break trong forEach

Từ khóa

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
8 thường dùng để thoát khỏi câu lệnh
function Counter() {
      this.sum = 0;
      this.count = 0;

      this.add = function(array) {
        array.forEach(function(item) {
          this.sum += item;
          ++this.count;
        }, this); // this chính là đối tượng tạo new Counter  }
    }

    const obj = new Counter();
    obj.add([2, 5, 9]);

    console.log(obj.count); // 3
    console.log(obj.sum); // 16
8 hoặc thoát khỏi vòng lặp (
function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
4,
function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
5,
function findFirstEvenIndex(arr) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1
1,
function Counter() {
      this.sum = 0;
      this.count = 0;

      this.add = function(array) {
        array.forEach(function(item) {
          this.sum += item;
          ++this.count;
        }, this); // this chính là đối tượng tạo new Counter  }
    }

    const obj = new Counter();
    obj.add([2, 5, 9]);

    console.log(obj.count); // 3
    console.log(obj.sum); // 16
5).

Ví dụ đoạn code sau dùng để thoát khỏi vòng lặp for khi

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
6 bằng
function findFirstEvenIndex(arr) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1
4:

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
0

Nếu sử dụng từ khóa

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
8 với forEach thì sao?

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
1

Đúng vậy, bạn sẽ bị lỗi cú pháp Illegal break statement vì từ khóa break là không hợp lệ với forEach JS.

Nghĩa là bạn không thể sử dụng từ khóa break với forEach. Thay vào đó bạn có thể sử dụng vòng lặp for như trên hoặc dùng phương thức

function findFirstEvenIndex(arr) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1
6 để thay thế:

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
2

Từ khóa continue trong forEach

Từ khóa

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
9 thường dùng để bỏ qua một lượt lặp trong vòng lặp.

Ví dụ đoạn code sau dùng để bỏ qua lượt lặp khi

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
6 bằng
function findFirstEvenIndex(arr) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1
4:

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
3

Nếu chuyển sang dùng với

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7:

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
4

Bạn sẽ bị lỗi Illegal continue statement: no surrounding iteration statement. Vì từ khóa

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
9 không hợp lệ với forEach JavaScript.

Nghĩa là bạn cũng không thể dùng

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
9 bên trong
arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7 được. Thay vào đó, bạn có thể dùng vòng lặp for như trên hoặc sử dụng từ khóa
function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
7 như sau:

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
5

Từ JavaScript forEach đến các phương thức khác

Ngoài forEach, JavaScript còn cung cấp một số phương thức khác, tương tự dành cho array. Đó là: entries, every, filter, find, findIndex, keys, map, reduce, reduceRight, some, values.

Trả về một mảng đối tượng mới, chứa key/value cho mỗi phần tử trong array.

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
6

Để duyệt mảng đối tượng mới này, mình sử dụng vòng lặp

function findFirstEvenIndex(arr) {
  arr.forEach(function (item, i) {
    if (arr[i] % 2 === 0) return i;
  });

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", -1);
// ret= -1
5:

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
7

Trả về

function findFirstEvenIndex(arr) {
  arr.forEach(function (item, i) {
    if (arr[i] % 2 === 0) return i;
  });

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", -1);
// ret= -1
6 nếu như tất cả các phần tử trong mảng thoả mãn 1 hàm kiểm tra, ngược lại trả về
function findFirstEvenIndex(arr) {
  arr.forEach(function (item, i) {
    if (arr[i] % 2 === 0) return i;
  });

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", -1);
// ret= -1
7.

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
8

Tham số truyền vào giống với hàm

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7.

Ví dụ sau trả về

function findFirstEvenIndex(arr) {
  arr.forEach(function (item, i) {
    if (arr[i] % 2 === 0) return i;
  });

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", -1);
// ret= -1
6 nếu tất cả các phần tử trong mảng thoả mãn đều lớn hơn hoặc bằng 10:

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
9

Giống như cái tên của nó, phương thức này dùng để lọc ra các phần tử trong mảng thoả mãn một điều kiện cho trước và trả về một mảng mới chứa những phần tử đó.

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
0

Tham số truyền vào giống với hàm

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7.

Ví dụ sau lọc ra những phần tử trong mảng có giá trị lớn hơn hoặc bằng 10:

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
1

Trả về giá trị của phần tử đầu tiên trong mảng thoả mãn điều kiện cho trước, nếu không tìm thấy thì trả về

function printContentArray(array) {
  array.forEach(function print(element) {
    console.log(element);
  });
}

printContentArray([1, 3, 5]);
0.

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
2

Tham số truyền vào cũng giống như hàm

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7.

Ví dụ sau tìm ra một object với

function findFirstEvenIndex(arr) {
  for (let i in arr) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1
3 thoả mãn điều kiện cho trước:

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
3

Trả về chỉ số đầu tiên của phần tử thoả mãn điều kiện cho trước, ngược lại trả về

function Counter() {
      this.sum = 0;
      this.count = 0;

      this.add = function(array) {
        array.forEach(function(item) {
          this.sum += item;
          ++this.count;
        }, this); // this chính là đối tượng tạo new Counter  }
    }

    const obj = new Counter();
    obj.add([2, 5, 9]);

    console.log(obj.count); // 3
    console.log(obj.sum); // 16
1.

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
4

Tham số truyền vào cũng giống như hàm

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7.

Ví dụ sau tìm ra chỉ số object với

function findFirstEvenIndex(arr) {
  for (let i in arr) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1
3 thoả mãn điều kiện cho trước:

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
5

Trả về mảng mới với mỗi phần tử là kết quả của việc gọi hàm callback với mỗi phần tử của mảng ban đầu.

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
6

Tham số truyền vào cũng giống như hàm

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
7 JavaScript.

Ví dụ sau trả về mảng mới, mà mỗi phần tử của mảng mới là căn bậc hai của phần tử tương ứng trong mảng ban đầu:

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
7

Những phương thức còn lại bạn có thể tham khảo thêm tại bài viết: Các phương thức của mảng trong JavaScript.

Thực hành

1. Flattening

Cho một mảng hai chiều, hãy chuyển mảng đó thành mảng một chiều, ví dụ:

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
8

► Sử dụng phương thức

function findFirstEvenIndex(arr) {
  for (let i in arr) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1
8 và
function findFirstEvenIndex(arr) {
  for (let i in arr) {
    if (arr[i] % 2 === 0) return i;
  }

  return -1;
}

// Ví dụ
const arr = [1, 2, 3, 4, 5];
const ret = findFirstEvenIndex(arr);

console.log("ret=", ret);
// ret= 1
9.

Đáp án

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

forEach(numbers, function (element) {
  sum += element;
});
console.log(sum);
// 55
9

► Sử dụng vòng lặp for, while thông thường.

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
0

2. Every and some

Hãy viết hàm

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
00 và
function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
01 thoả mãn:

  • function forEach(array, action) {
      for (let i = 0; i < array.length; i++) {
        action(array[i]);
      }
    }
    
    02: trả về
    function findFirstEvenIndex(arr) {
      arr.forEach(function (item, i) {
        if (arr[i] % 2 === 0) return i;
      });
    
      return -1;
    }
    
    // Ví dụ
    const arr = [1, 2, 3, 4, 5];
    const ret = findFirstEvenIndex(arr);
    
    console.log("ret=", -1);
    // ret= -1
    
    6 khi tất cả các phần tử của mảng
    function forEach(array, action) {
      for (let i = 0; i < array.length; i++) {
        action(array[i]);
      }
    }
    
    04 làm hàm
    function forEach(array, action) {
      for (let i = 0; i < array.length; i++) {
        action(array[i]);
      }
    }
    
    05 trả về
    function findFirstEvenIndex(arr) {
      arr.forEach(function (item, i) {
        if (arr[i] % 2 === 0) return i;
      });
    
      return -1;
    }
    
    // Ví dụ
    const arr = [1, 2, 3, 4, 5];
    const ret = findFirstEvenIndex(arr);
    
    console.log("ret=", -1);
    // ret= -1
    
    6, ngược lại thì trả về
    function findFirstEvenIndex(arr) {
      arr.forEach(function (item, i) {
        if (arr[i] % 2 === 0) return i;
      });
    
      return -1;
    }
    
    // Ví dụ
    const arr = [1, 2, 3, 4, 5];
    const ret = findFirstEvenIndex(arr);
    
    console.log("ret=", -1);
    // ret= -1
    
    7.
  • function forEach(array, action) {
      for (let i = 0; i < array.length; i++) {
        action(array[i]);
      }
    }
    
    08: trả về
    function findFirstEvenIndex(arr) {
      arr.forEach(function (item, i) {
        if (arr[i] % 2 === 0) return i;
      });
    
      return -1;
    }
    
    // Ví dụ
    const arr = [1, 2, 3, 4, 5];
    const ret = findFirstEvenIndex(arr);
    
    console.log("ret=", -1);
    // ret= -1
    
    6 khi ít nhất một phần tử của mảng
    function forEach(array, action) {
      for (let i = 0; i < array.length; i++) {
        action(array[i]);
      }
    }
    
    04 làm hàm
    function forEach(array, action) {
      for (let i = 0; i < array.length; i++) {
        action(array[i]);
      }
    }
    
    05 trả về
    function findFirstEvenIndex(arr) {
      arr.forEach(function (item, i) {
        if (arr[i] % 2 === 0) return i;
      });
    
      return -1;
    }
    
    // Ví dụ
    const arr = [1, 2, 3, 4, 5];
    const ret = findFirstEvenIndex(arr);
    
    console.log("ret=", -1);
    // ret= -1
    
    6, ngược lại thì trả về
    function findFirstEvenIndex(arr) {
      arr.forEach(function (item, i) {
        if (arr[i] % 2 === 0) return i;
      });
    
      return -1;
    }
    
    // Ví dụ
    const arr = [1, 2, 3, 4, 5];
    const ret = findFirstEvenIndex(arr);
    
    console.log("ret=", -1);
    // ret= -1
    
    7.

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
1

Xem đáp án:

  • Hàm every

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
2

  • Hàm some

arr.forEach(function callback(currentValue, index, array) {
  // code xử lý
}[, thisArg]);
3

Tổng kết

Trên đây là một số kiến thức cơ bản về forEach trong JavaScript.

Hy vọng qua bài viết này bạn hiểu được forEach JavaScript là gì? Cách sử dụng forEach và khi nào nên sử dụng forEach JS.