Array Grouping In JavaScript (2024)
Array Grouping is not a new thing in JavaScript . Array Grouping is a new feature in JavaScript that helps developers organize elements in an array into groups based on a specific characteristic. This makes it easier to find and work with data.
Now , the questions is how does it works ?
well, before coming latest and modern method developer groups the array elements many different ways on of them is "reduce method".
example :
const students = [
{name: "SK Toukir", age: 21 },
{name: "SK Turaj", age: 21},
{name: "SK Jehan", age: 20},
];
const studentAges = student.reduce((result, student=>{
const age = student.age;
if( !result[ age ] ){
result[ age ]= [ ];
} result[ age ].push( student );
return result;
}),{});
console.log( studentAges );
But in modern JavaScript It become very easy , developers can do this in a minutes using "Object . groupBy" method or " array.group"
method .
1.Object . groupBy
example :
const students = [
{name: "SK Toukir", age: 21 },
{name: "SK Turaj", age: 21},
{name: "SK Jehan", age: 20},
];
const studentAges = Object.groupBy( students, ( student=>student.age ) );
console.log( studentAges );
In this method first developers write Object.groupBy (method name) it takes 2 paramiters. First paramiter will be the array name and the second paramiter will be a call back function and by that developers can easily groups the array elements.
const students = [
{name: "SK Toukir", age: 21 },
{name: "SK Turaj", age: 21},
{name: "SK Jehan", age: 20},
];
const studentAges = students.group( student=>student.age );
console.log( studentAges );
The group() method takes the items in your array and sorts them into groups. Each group has a label (called a "key"), and the items that belong to that group are stored together in an array.
Notice : If these tow method do not work in anyone's node version then open the terminal in your "vs code" the type "npm i core-js" then run the code again , hopefully it will work .
The above is the detailed content of Array Grouping In JavaScript (4). For more information, please follow other related articles on the PHP Chinese website!