Sử dụng JavaScript reduce() để xử lý mảng hiệu quả

Giới thiệu về hàm reduce()

Hàm reduce() là một phương thức của đối tượng Array trong JavaScript. Nó được sử dụng để thực hiện một hàm lặp qua tất cả các phần tử của mảng, tích lũy một giá trị duy nhất dựa trên logic mà bạn cung cấp. Cú pháp cơ bản của reduce() như sau:

 array.reduce(callback, initialValue) 

Trong đó:

• callback là hàm sẽ được gọi cho mỗi phần tử của mảng.
• initialValue (tùy chọn) là giá trị khởi tạo của biến accumulator.

Callback function nhận hai đối số:

1. accumulator: Giá trị tích lũy từ lần lặp trước.
2. currentValue: Phần tử hiện tại của mảng.

Ví dụ đơn giản về reduce()

Giả sử chúng ta có một mảng số nguyên và muốn tính tổng của tất cả các phần tử trong mảng đó:

const numbers = [1, 2, 3, 4, 5]; const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); console.log(sum); // Output: 15 

Trong ví dụ trên, hàm reduce() lặp qua các phần tử của mảng numbers và cộng chúng với nhau. Giá trị khởi tạo của accumulator là 0, và giá trị cuối cùng của accumulator (sau khi lặp qua tất cả các phần tử) là 15.

Một số ứng dụng thực tế của reduce()

Hàm reduce() không chỉ giới hạn trong việc tính tổng các phần tử mảng. Nó có thể được sử dụng trong nhiều trường hợp khác nhau, như:

Nén mảng

const flattened = [[0, 1], [2, 3], [4, 5]].reduce((accumulator, currentValue) => accumulator.concat(currentValue), []); console.log(flattened); // Output: [0, 1, 2, 3, 4, 5] 

Trong ví dụ trên, hàm reduce() được sử dụng để nén một mảng hai chiều thành một mảng một chiều bằng cách nối tất cả các phần tử con.

Nhóm các phần tử theo một thuộc tính

const people = [ { name: 'Alice', age: 21 }, { name: 'Bob', age: 25 }, { name: 'Charlie', age: 21 }, { name: 'Dave', age: 30 } ]; const groupedByAge = people.reduce((accumulator, currentValue) => { const age = currentValue.age; if (!accumulator[age]) { accumulator[age] = []; } accumulator[age].push(currentValue); return accumulator; }, {}); console.log(groupedByAge); // Output: // { // 21: [{ name: 'Alice', age: 21 }, { name: 'Charlie', age: 21 }], // 25: [{ name: 'Bob', age: 25 }], // 30: [{ name: 'Dave', age: 30 }] // } 

Trong ví dụ này, chúng ta sử dụng reduce() để nhóm các đối tượng trong mảng people theo thuộc tính age. Kết quả là một đối tượng có các khóa là tuổi và giá trị là mảng các đối tượng có cùng tuổi đó.

Thực hiện các phép tính phức tạp

const numbers = [1, 2, 3, 4, 5]; const product = numbers.reduce((accumulator, currentValue) => accumulator * currentValue, 1); console.log(product); // Output: 120 

Trong ví dụ này, hàm reduce() được sử dụng để tính tích của tất cả các phần tử trong mảng numbers. Giá trị khởi tạo của accumulator là 1 để đảm bảo tính đúng đắn của phép nhân.

Kết luận

Hàm reduce() trong JavaScript là một công cụ mạnh mẽ để xử lý mảng. Nó cho phép bạn thực hiện các phép tính, chuyển đổi hoặc tổng hợp dữ liệu một cách linh hoạt và hiệu quả. Mặc dù có vẻ phức tạp ở giai đoạn đầu, nhưng một khi bạn nắm được cách sử dụng hàm này, nó sẽ trở thành một phần không thể thiếu trong kỹ năng lập trình JavaScript của bạn.

Các bạn có thể tham khảo thêm nguồn khác: