Transform an array of objects into a two-dimensional array to organize elements by their identical ids in typescript

Question

Transform an array of objects into a two-dimensional array to organize elements by their identical ids in typescript

I have a collection of objects:

arr1 = [{catid: 1, name: 'mango', category: 'fruit'}, {catid: 2, name: 'potato', category: 'veg'}, {catid: 3, name: 'chiken', category: 'nonveg'},{catid: 1, name: 'apple', category: 'fruit'}, {catid: 1, name: 'banana', category: 'fruit'}];

I am looking to transform the array into a two-dimensional array based on the catid property (essentially grouping elements with the same catid together):

arr2 = [[{catid: 1, name: 'mango', category: 'fruit'},{catid: 1, name: 'apple', category: 'fruit'}, {catid: 1, name: 'banana', category: 'fruit'} ],[{catid: 2, name: 'potato', category: 'veg'}],[{catid: 3, name: 'chicken', category: 'nonveg'}]]

How can I achieve this in typescript or javascript?

javascript arrays json typescript multidimensional-array

Answer 1

Answer №1

If you want to achieve this, you can utilize the Object.groupBy() method:

const arr1 = [{catid: 1, name: 'mango', category: 'fruit'}, {catid: 2, name: 'potato', category: 'veg'}, {catid: 3, name: 'chiken', category: 'nonveg'},{catid: 1, name: 'apple', category: 'fruit'}, {catid: 1, name: 'banana', category: 'fruit'}];

const result = Object.values(Object.groupBy(arr1, item => item.catid));
console.log(JSON.stringify(result));

An alternative approach is using the Array#reduce() function:

Playground

const arr1 = [{catid: 1, name: 'mango', category: 'fruit'}, {catid: 2, name: 'potato', category: 'veg'}, {catid: 3, name: 'chiken', category: 'nonveg'},{catid: 1, name: 'apple', category: 'fruit'}, {catid: 1, name: 'banana', category: 'fruit'}];

const result = arr1.reduce((r, item) => 
    ((r.map.get(item.catid)?.push(item) ?? r.map.set(item.catid, r.arr[r.arr.length] = [item])), r), 
    {map: new Map<typeof arr1[number]['catid'], typeof arr1[number][]>, arr: new Array<typeof arr1>}).arr;

console.log(JSON.stringify(result));

Answer 2

If you want to achieve this, you can utilize the Object.groupBy() method:

const arr1 = [{catid: 1, name: 'mango', category: 'fruit'}, {catid: 2, name: 'potato', category: 'veg'}, {catid: 3, name: 'chiken', category: 'nonveg'},{catid: 1, name: 'apple', category: 'fruit'}, {catid: 1, name: 'banana', category: 'fruit'}];

const result = Object.values(Object.groupBy(arr1, item => item.catid));
console.log(JSON.stringify(result));

An alternative approach is using the Array#reduce() function:

Playground

const arr1 = [{catid: 1, name: 'mango', category: 'fruit'}, {catid: 2, name: 'potato', category: 'veg'}, {catid: 3, name: 'chiken', category: 'nonveg'},{catid: 1, name: 'apple', category: 'fruit'}, {catid: 1, name: 'banana', category: 'fruit'}];

const result = arr1.reduce((r, item) => 
    ((r.map.get(item.catid)?.push(item) ?? r.map.set(item.catid, r.arr[r.arr.length] = [item])), r), 
    {map: new Map<typeof arr1[number]['catid'], typeof arr1[number][]>, arr: new Array<typeof arr1>}).arr;

console.log(JSON.stringify(result));

Answer 3

Answer №2

To achieve the same outcome, one can opt for using a for loop:

      // Sorting arrays by 'catid'
        const arr1 = [
            {catid: 1, name: 'mango', category: 'fruit'},
            {catid: 2, name: 'potato', category: 'veg'},
            {catid: 3, name: 'chicken', category: 'nonveg'},
            {catid: 1, name: 'apple', category: 'fruit'},
            {catid: 1, name: 'banana', category: 'fruit'}
        ];

        const result = {};

        for(var {catid, name, category} of arr1) {
            if(!result[catid]) result[catid] = [];
            result[catid].push({ catid, name, category });
        }

        console.log(JSON.stringify({"Sorted Data": result},null,2));

Answer 4

To achieve the same outcome, one can opt for using a for loop:

      // Sorting arrays by 'catid'
        const arr1 = [
            {catid: 1, name: 'mango', category: 'fruit'},
            {catid: 2, name: 'potato', category: 'veg'},
            {catid: 3, name: 'chicken', category: 'nonveg'},
            {catid: 1, name: 'apple', category: 'fruit'},
            {catid: 1, name: 'banana', category: 'fruit'}
        ];

        const result = {};

        for(var {catid, name, category} of arr1) {
            if(!result[catid]) result[catid] = [];
            result[catid].push({ catid, name, category });
        }

        console.log(JSON.stringify({"Sorted Data": result},null,2));

Transform an array of objects into a two-dimensional array to organize elements by their identical ids in typescript

Answer №1

Answer №2

Similar questions

The error middleware in Express is not defined

Attempting to authenticate with Next.js using JWT in a middleware is proving to be unsuccessful

Importing a JavaScript file into another JavaScript file as text in React Native can be a convenient way

How come the splice method is changing the value of the original object?

How can nunjucks templates be accessed from NPM (node modules)?

Ensuring that toggleClass is consistently displayed for all visitors to the website

JavaScript: iterating over an array of objects containing nested arrays

The error message "domElement" cannot be modified because it is read-only in the THREE.WebGLRenderer

Utilizing JSON to generate cxf-wadl2java mappings

What are the steps to preview a video using AngularJS?

Interrogating a multi-dimensional array using the MongoDB C# driver

Issues with the initial calculator project I built using JavaScript (excluding HTML and CSS)

JQuery is displaying the word "undefined" instead of the expected JSON array values

System.Net.WebException: Connection error: ConnectFailure (Connection refused)

What is the best way to retrieve a document from a collection in a Meteor application?

Instructions on retrieving the index of an element from an array utilizing the Arrays.asList method

Can Vue.js be paired with pure Node.js as a backend without relying on Express?

Tips for arranging multiple arrays based on the order of the first array

Toggle visibility (individually duplicating) one thousand sentences while maintaining optimal browser and host performance

Working with Dynamic JSON Parsing in C#