Object.groupBy()

Try it

const inventory = [
  { name: "asparagus", type: "vegetables", quantity: 9 },
  { name: "bananas", type: "fruit", quantity: 5 },
  { name: "goat", type: "meat", quantity: 23 },
  { name: "cherries", type: "fruit", quantity: 12 },
  { name: "fish", type: "meat", quantity: 22 },
];

const result = Object.groupBy(inventory, ({ quantity }) =>
  quantity < 6 ? "restock" : "sufficient",
);
console.log(result.restock);
// [{ name: "bananas", type: "fruit", quantity: 5 }]

Cú pháp

Object.groupBy(items, callbackFn)

Tham số

items

Một iterable (chẳng hạn như Array) mà các phần tử sẽ được nhóm.

callbackFn

Hàm được thực thi cho mỗi phần tử trong iterable. Nó nên trả về một giá trị có thể được ép kiểu thành property key (chuỗi hoặc symbol) chỉ ra nhóm của phần tử hiện tại. Hàm được gọi với các đối số sau:

element

Phần tử hiện tại đang được xử lý.

index

Chỉ số của phần tử hiện tại đang được xử lý.

Giá trị trả về

Một đối tượng null-prototype với các thuộc tính cho tất cả các nhóm, mỗi nhóm được gán một mảng chứa các phần tử của nhóm liên kết.

Mô tả

Object.groupBy() gọi hàm callbackFn được cung cấp một lần cho mỗi phần tử trong iterable. Hàm callback nên trả về chuỗi hoặc symbol (các giá trị không phải các kiểu này sẽ được ép kiểu thành chuỗi) chỉ ra nhóm của phần tử liên kết. Các giá trị được trả về bởi callbackFn được sử dụng làm khóa cho đối tượng được trả về bởi Object.groupBy(). Mỗi khóa có một mảng liên kết chứa tất cả các phần tử mà callback trả về cùng giá trị.

Các phần tử trong đối tượng được trả về và iterable ban đầu là như nhau (không phải bản sao sâu). Việc thay đổi cấu trúc nội bộ của các phần tử sẽ được phản ánh trong cả iterable ban đầu và đối tượng được trả về.

Ví dụ

Sử dụng Object.groupBy()

Đầu tiên chúng ta định nghĩa một mảng chứa các đối tượng đại diện cho kho hàng của các loại thực phẩm khác nhau. Mỗi thực phẩm có type và quantity.

const inventory = [
  { name: "asparagus", type: "vegetables", quantity: 5 },
  { name: "bananas", type: "fruit", quantity: 0 },
  { name: "goat", type: "meat", quantity: 23 },
  { name: "cherries", type: "fruit", quantity: 5 },
  { name: "fish", type: "meat", quantity: 22 },
];

Đoạn code dưới đây nhóm các phần tử theo giá trị của thuộc tính type của chúng.

const result = Object.groupBy(inventory, ({ type }) => type);

/* Result is:
{
  vegetables: [
    { name: 'asparagus', type: 'vegetables', quantity: 5 },
  ],
  fruit: [
    { name: "bananas", type: "fruit", quantity: 0 },
    { name: "cherries", type: "fruit", quantity: 5 }
  ],
  meat: [
    { name: "goat", type: "meat", quantity: 23 },
    { name: "fish", type: "meat", quantity: 22 }
  ]
}
*/

Arrow function chỉ trả về type của mỗi phần tử mảng mỗi khi nó được gọi. Lưu ý rằng đối số hàm { type } là một ví dụ cơ bản về cú pháp destructuring đối tượng cho đối số hàm. Điều này giải nén thuộc tính type của một đối tượng được truyền vào như một tham số, và gán nó cho một biến có tên type trong phần thân của hàm. Đây là cách rất súc tích để truy cập các giá trị liên quan của các phần tử trong một hàm.

Chúng ta cũng có thể tạo các nhóm được suy ra từ các giá trị trong một hoặc nhiều thuộc tính của các phần tử. Dưới đây là một ví dụ rất tương tự đặt các mục vào nhóm ok hoặc restock dựa trên giá trị của trường quantity.

function myCallback({ quantity }) {
  return quantity > 5 ? "ok" : "restock";
}

const result2 = Object.groupBy(inventory, myCallback);

/* Result is:
{
  restock: [
    { name: "asparagus", type: "vegetables", quantity: 5 },
    { name: "bananas", type: "fruit", quantity: 0 },
    { name: "cherries", type: "fruit", quantity: 5 }
  ],
  ok: [
    { name: "goat", type: "meat", quantity: 23 },
    { name: "fish", type: "meat", quantity: 22 }
  ]
}
*/

Đặc tả

Tương thích trình duyệt

Xem thêm

• Polyfill of Object.groupBy in core-js
• es-shims polyfill of Object.groupBy
• Indexed collections guide
• Array.prototype.reduce()
• Object.fromEntries()
• Map.groupBy()