Ví dụ về JavaScript Filter lọc mảng

JavaScript Map vs Filter: Chọn phương thức nào cho hiệu quả?

vào

JavaScript map và filter là hai phương thức mảng mạnh mẽ giúp đơn giản hóa việc xử lý dữ liệu. Chúng thường gây nhầm lẫn cho những người mới bắt đầu, vậy khi nào nên dùng map và khi nào nên dùng filter? Bài viết này sẽ giúp bạn phân biệt rõ ràng hai phương thức này và lựa chọn đúng đắn cho từng trường hợp cụ thể.

Hiểu rõ về JavaScript Map

map tạo ra một mảng mới bằng cách áp dụng một hàm cho từng phần tử của mảng ban đầu. Nó không thay đổi mảng gốc mà trả về một mảng mới với cùng số lượng phần tử, nhưng giá trị của chúng có thể đã được biến đổi.

  • Mục đích: Biến đổi từng phần tử của mảng.
  • Kết quả: Một mảng mới với cùng số lượng phần tử, nhưng giá trị đã được biến đổi.

Ví dụ:

const numbers = [1, 2, 3, 4, 5];
const doubled = numbers.map(number => number * 2);
// doubled sẽ là [2, 4, 6, 8, 10]

is shown on the left, and the resulting array [2, 4, 6, 8, 10] is shown on the right. Arrows connect each element in the original array to its corresponding doubled value in the new array.]

Tìm hiểu về JavaScript Filter

filter tạo ra một mảng mới chứa các phần tử của mảng ban đầu thỏa mãn một điều kiện cụ thể. Nó cũng không thay đổi mảng gốc.

  • Mục đích: Lọc các phần tử của mảng dựa trên một điều kiện.
  • Kết quả: Một mảng mới chứa các phần tử thỏa mãn điều kiện.

Ví dụ:

const numbers = [1, 2, 3, 4, 5];
const even = numbers.map(number => number % 2 === 0);
// even sẽ là [2, 4]

Ví dụ về JavaScript Filter lọc mảngVí dụ về JavaScript Filter lọc mảng is displayed, and a filter condition “number % 2 === 0” is highlighted. The resulting array [2, 4] is shown, containing only the even numbers from the original array.]

JavaScript Map vs Filter: So sánh chi tiết

Khi nào nên dùng Map?

  • Khi bạn cần biến đổi mỗi phần tử của mảng thành một giá trị mới.
  • Khi bạn cần tạo một mảng mới với cùng số lượng phần tử, nhưng giá trị đã được thay đổi.

Khi nào nên dùng Filter?

  • Khi bạn cần chọn lọc các phần tử thỏa mãn một điều kiện cụ thể.
  • Khi bạn cần tạo một mảng mới với số lượng phần tử ít hơn hoặc bằng mảng gốc.

Kết hợp Map và Filter

Bạn có thể kết hợp map và filter để thực hiện các thao tác phức tạp hơn. Ví dụ, bạn có thể lọc ra các số chẵn trong một mảng, sau đó nhân đôi các số đó.

const numbers = [1, 2, 3, 4, 5];
const doubledEven = numbers.filter(number => number % 2 === 0).map(number => number * 2);
// doubledEven sẽ là [4, 8]

is processed first by a filter to select even numbers, resulting in [2, 4]. Then, a map function doubles each element of the filtered array, producing the final result [4, 8]. The image visually represents each step of the process with arrows and annotations.]

Kết luận

Javascript Map Vs Filter là hai công cụ hữu ích cho việc xử lý mảng. Hiểu rõ sự khác biệt giữa chúng sẽ giúp bạn viết code JavaScript hiệu quả hơn. Hãy chọn map khi bạn cần biến đổi từng phần tử và filter khi bạn cần lọc các phần tử dựa trên một điều kiện.

FAQ

  1. Sự khác biệt chính giữa map và filter là gì?
  2. Tôi có thể sử dụng map và filter cùng nhau không?
  3. Map và filter có thay đổi mảng gốc không?
  4. Có những phương thức mảng nào khác tương tự như map và filter?
  5. Làm thế nào để sử dụng map và filter với các đối tượng phức tạp?
  6. Map và filter có hiệu quả hơn vòng lặp for truyền thống không?
  7. Tôi có thể sử dụng map và filter với các thư viện JavaScript khác không?

Gợi ý các bài viết khác: JavaScript Array Methods, Hiểu về Functional Programming trong JavaScript.

Khi cần hỗ trợ hãy liên hệ Số Điện Thoại: 02838172459, Email: [email protected] Hoặc đến địa chỉ: 596 Đ. Hậu Giang, P.12, Quận 6, Hồ Chí Minh 70000, Việt Nam. Chúng tôi có đội ngũ chăm sóc khách hàng 24/7.

VS