forEach()map() là hai phương thức phổ biến trong JavaScript được sử dụng để lặp qua các phần tử của mảng. Dưới đây là một số điểm khác nhau giữa chúng:

1. Mục đích sử dụng

  • forEach():
    • Dùng để thực hiện một hành động (callback function) trên mỗi phần tử của mảng.
    • Không trả về giá trị nào (undefined). Chỉ thực hiện một thao tác mà không tạo ra một mảng mới.
  • map():
    • Dùng để biến đổi mỗi phần tử của mảng thành một phần tử mới bằng cách áp dụng một hàm vào từng phần tử.
    • Trả về một mảng mới chứa các giá trị đã được biến đổi.

2. Giá trị trả về

  • forEach():
    • Không trả về giá trị nào, chỉ thực hiện một hành động và trả về undefined.
const numbers = [1, 2, 3];
numbers.forEach(num => {
    console.log(num * 2); // In ra 2, 4, 6
});
const result1 = numbers.forEach(num => num * 2);
console.log(result1); // undefined
  • map():
    • Trả về một mảng mới chứa các giá trị đã được biến đổi.
const numbers = [1, 2, 3];
const result2 = numbers.map(num => num * 2);
console.log(result2); // [2, 4, 6]

3. Thay đổi mảng gốc

  • forEach():
    • Có thể thay đổi các phần tử trong mảng gốc nếu bạn thực hiện một hành động thay đổi bên trong callback.
const numbers = [1, 2, 3];
numbers.forEach((num, index) => {
    numbers[index] = num * 2; // Thay đổi mảng gốc
});
console.log(numbers); // [2, 4, 6]
  • map():
    • Không thay đổi mảng gốc. Nó tạo ra một mảng mới.
const numbers = [1, 2, 3];
const doubled = numbers.map(num => num * 2);
console.log(numbers); // [1, 2, 3]
console.log(doubled); // [2, 4, 6]

4. Tính hiệu quả

  • forEach():
    • Thích hợp khi bạn chỉ cần thực hiện một tác vụ trên mỗi phần tử mà không cần tạo ra một mảng mới.
  • map():
    • Thích hợp khi bạn cần tạo một mảng mới từ một mảng hiện có.

Tóm tắt

Tiêu chíforEach()map()
Mục đíchThực hiện hành động trên mỗi phần tửBiến đổi và tạo mảng mới
Giá trị trả vềundefinedMảng mới
Thay đổi mảng gốcCó thể thay đổiKhông thay đổi
Hiệu suấtThích hợp cho các tác vụThích hợp cho biến đổi dữ liệu

Như vậy, bạn nên chọn forEach() khi bạn muốn thực hiện một hành động mà không cần lưu kết quả, và chọn map() khi bạn muốn biến đổi dữ liệu và cần một mảng mới chứa kết quả.