New upcoming array method called groupBy()

The groupBy() method is a forthcoming addition to the JavaScript Array object, currently positioned at Stage 3 within the TC39 process.

? Its advancement to Stage 3 indicates a high likelihood of being incorporated into the ECMAScript standard soon.

? groupBy() expects a callback function as its parameter.

? The callback function is invoked for each array element, and it should yield a string or symbol representing the group to which the element belongs.

Syntax

Object.groupBy(items, callbackFn)

Example #1

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 }
  ]
}        

Example #2

const number = [1, 2, 3, 4, 5, 6, 7, 8];

const groupBy = Object.groupBy(number, (num, index) => {

    return num % 2 === 0 ? 'even' : 'odd'

})

console.log('groupBy', groupBy);

Result is:
{
    "odd": [1, 3, 5, 7],
    "even": [2, 4, 6, 8]
}        

for more detail


要查看或添加评论,请登录

Asad Khan的更多文章

  • Next.js 15 has FINALLY arrived!

    Next.js 15 has FINALLY arrived!

    Next.js 15 is now officially stable and ready for production! This release incorporates enhancements from both RC1 and…

  • Error Cause: Enhanced Debugging

    Error Cause: Enhanced Debugging

    In ES13 (ECMAScript 2022), the property was introduced for the object. This property allows you to chain errors…

  • #JS with() new Array method

    #JS with() new Array method

    The method is a new addition to JavaScript's array methods introduced in ECMAScript 2023 (ES14). It allows you to…

  • #JS Dynamic Object Keys

    #JS Dynamic Object Keys

    This one-liner uses computed property names, where the value of the prop variable is used as the key name inside the…

  • Object property existence check in JS

    Object property existence check in JS

    Suppose building a user profile system and need to check if a specific attribute (like "email") is present in a user…

  • Difference between return vs return await #JavaScript

    Difference between return vs return await #JavaScript

    In JavaScript, when using functions and to handle asynchronous operations, there's a difference between and . Return:…

  • Next.js 15 Release Candidate (RC) is now available

    Next.js 15 Release Candidate (RC) is now available

    The Next.js 15 Release Candidate (RC) is now available, offering a chance to test new features before the stable…

  • Angular v18 is now available!

    Angular v18 is now available!

    This version continues to innovate while bringing stability to the Angular ecosystem, which has become somewhat…

  • Closure in JavaScript

    Closure in JavaScript

    In JavaScript, a closure is a combination of a function and the lexical environment within which that function was…

  • Lazy Loading

    Lazy Loading

    Lazy loading is a technique in web development where assets (such as images, scripts, or stylesheets) are loaded only…

社区洞察

其他会员也浏览了