#LearnedToday：Object.groupBy()

？終於出來了！不再需要編寫醜陋的程式碼來按字段的特定值對物件數組進行分組！

自 2023 年底以來，物件有一個名為 groupBy() 的官方靜態方法，可以為我們做到這一點！
它接受一個 Iterable（例如陣列）和一個函數，該函數針對每個元素執行，並且必須傳回該特定元素的「類別」。
此方法傳回一個新對象，其中每個鍵都是一個不同的類別，其中包含屬於該特定類別的物件陣列。

注意：傳回的物件和原始可迭代物件中的元素是相同的（不是深拷貝！）。更改元素的內部結構將反映在原始可迭代物件和傳回的物件中。

例子

讓我們舉一個實際的例子來看看按年齡將所有忍者神龜角色分組是多麼容易。

初始數組

const ninjaTurtlesCharacters = [
  { age: 16, name: 'Michelangelo' },
  { age: 16, name: 'Raffaello' },
  { age: 16, name: 'Donatello' },
  { age: 16, name: 'Leonardo' },
  { age: 91, name: 'Splinter' },
  { age: 25, name: 'Casey Jones' },
  { age: 25, name: 'April O\'Neil' }
];

好的舊方法（使用reduce）

const ninjaTurtlesCharactersByAge = ninjaTurtlesCharacters.reduce(
  (groupedPeople, item) => ({
    ...groupedPeople,
    [item.age]: groupedPeople[item.age]
      ? [...groupedPeople[item.age], item]
      : [item],
  }),
  {}
);

現代方式

const ninjaTurtlesCharactersByAgeNew = Object.groupBy(
  ninjaTurtlesCharacters,
  ({ age }) => age
);

提示：如果您想回傳 Map 而不是 Object，請使用 Map.groupBy()

結果

{
  "16": [
    { age: 16, name: 'Michelangelo' },
    { age: 16, name: 'Raffaello' },
    { age: 16, name: 'Donatello' },
    { age: 16, name: 'Leonardo' }
  ],
  "25": [
    { age: 25, name: 'Casey Jones' },
    { age: 25, name: 'April O\'Neil' }
  ],
  "91": [
    { age: 91, name: 'Splinter' }
  ]
}

示範

??‍?像往常一樣，我創建了一個簡單的 Stackblitz 專案來使用程式碼。

？文件：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/groupBy

ℹ 瀏覽器支援：https://caniuse.com/mdn-javascript_builtins_object_groupby

以上是#LearnedToday：Object.groupBy()的詳細內容。更多資訊請關注PHP中文網其他相關文章！