Phân biệt 3 array method map(), filter(), forEach() trong javascript
· 2 phút để đọc
Giống nhau:
- forEach() và map() và filter() đều làm việc , hay đều thực hiện callback lên từng phần tử trong mảng. Nghĩa là cả 3 method này đều sẽ DUYỆT qua các phần tử trong mảng.
Khác nhau:
map() | forEarch() | filter() |
---|---|---|
Có trả về giá trị | Không trả về giá trị nào cả | Có trả về giá trị |
Tạo ra mảng mới có cùng số phần tử với mảng cũ và trả về mảng mới | Hàm callback có thể thay đổi trực tiếp mảng ban đầu | Trả về các giá trị phần tử trong mảng cũ mà có thỏa mãn điều kiện |
Sử dụng khi : cần tạo ra một mảng mới từ mảng gốc sau khi thực hiện biến đổi hoặc xử lý các phần tử. | Sử dụng khi: muốn thực hiện một hành động nào đó cho từng phần tử mà không cần tạo ra một mảng mới. | Sử dụng khi: Muốn lọc ra các phần tử của mảng theo điều kiện nào đó. |
Ví dụ
Ví dụ về method map() của array:
Nhân tất cả các phần tử trong mảng lên 2 lần
const array1 = [1, 4, 9, 16];
// Pass a function to map
const map1 = array1.map((x) => x * 2);
console.log(map1);
// Expected output: Array [2, 8, 18, 32]
Ví dụ về method forEach() của array:
In các phần tử trong Mảng
const array1 = ['a', 'b', 'c'];
array1.forEach((element) => console.log(element));
// Expected output: "a"
// Expected output: "b"
// Expected output: "c"
Ví dụ về method filter() của array:
Lọc ra các phần tử có là số chẵn
const numbers = [1, 2, 3, 4, 5, 6];
const result = numbers.filter((n) => n %2 === 0);
console.log(result);
// Expected output: Array [2, 4, 6]