Sub-grouping array of objects inside of sub-array of main array

Question

I have an array like this

[
    {
        "id": 1,
        "name": "Personal Information",
        "TabFields": [
            {
                "name": "First Name",
                "field": {
                    "code": "personFirstName"
                }
            },
            {
                "name": "Gender",
                "field": {
                    "code": "personGenderD"
                }
            },
            {
                "name": "Last Name",
                "field": {
                    "code": "personLastName"
                }
            },
            {
                "name": "Mobile Number",
                "field": {
                    "code": "mobileNumber"
                }
            },
            {
                "name": "Email Address",
                "field": {
                    "code": "emailAddress"
                }
            }
        ]
    }
]

What I need is to group the objects inside the TabFields to their respective TAB (PERSONAL_INFORMATION, CONTACT_DETAILS) by code value inside the field object

The object

"name": "First Name",
"field": {
    "code": "personFirstName"
}

"name": "Gender",
"field": {
    "code": "personGenderD"
}

"name": "Last Name",
"field": {
    "code": "personLastName"
}

is belong to PERSONAL_INFORMATION and the object

"name": "Mobile Number",
"field": {
    "code": "mobileNumber"
}

"name": "Email Address",
"field": {
    "code": "emailAddress"
}

is belong to CONTACT_DETAILS. So the output would be

[
    {
        "id": 1,
        "name": "Personal Information",
        "TabFields": [
            {
                "label": "PERSONAL_INFORMATION",
                "code": "PERSONAL_INFORMATION",
                "fields": [
                    {
                        "name": "First Name",
                        "field": {
                            "code": "personFirstName"
                        }
                    },
                    {
                        "name": "Gender",
                        "field": {
                            "code": "personGenderD"
                        }
                    },
                    {
                        "name": "Last Name",
                        "field": {
                            "code": "personLastName"
                        }
                    }
                ]
            },
            {
                "label": "CONTACT_DETAILS",
                "code": "PERSONAL_INFORMATION",
                "fields": [
                    {
                        "name": "Mobile Number",
                        "field": {
                            "code": "mobileNumber"
                        }
                    },
                    {
                        "name": "Email Address",
                        "field": {
                            "code": "emailAddress"
                        }
                    }
                ]
            }
        ]
    }
]

How to do it in javascript?

Rajneesh · Accepted Answer · 2020-05-28 08:26:47Z

1

You can also do this with map:

var arr=[ { "id": 1, "name": "Personal Information", "TabFields": [ { "name": "First Name", "field": { "code": "personFirstName" } }, { "name": "Gender", "field": { "code": "personGenderD" } }, { "name": "Last Name", "field": { "code": "personLastName" } }, { "name": "Mobile Number", "field": { "code": "mobileNumber" } }, { "name": "Email Address", "field": { "code": "emailAddress" } } ] }];

personalContact = ["Mobile Number", "Email Address"];

result = arr.map(val=>{
    personalInfo = { label:'personal', code:val.name, fields:val.TabFields.filter(k=>!personalContact.includes(k.name))};
    contactInfo = { label:'contact', code:val.name, fields:val.TabFields.filter(k=>personalContact.includes(k.name))};
    val.TabFields = [personalInfo, contactInfo];
    return val;
});

console.log(result);

Idea would be to have an array which should distinguish between the contact details and personal details using which you can apply filter to get the data.

answered May 28, 2020 at 8:26

Rajneesh

5,3181 gold badge10 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

9years Over a year ago

Hi @gorak, the array is not only personalInfo and contactIfo. So this will be handled dynamically

richytong · Accepted Answer · 2020-05-28 18:59:05Z

You can express transformations simply with a library I created, rubico.

const { pipe, fork, assign, get, map, filter } = require('rubico')

const PERSONAL_INFORMATION_FIELDS = new Set(['First Name', 'Gender', 'Last Name'])

const CONTACT_DETAILS_FIELDS = new Set(['Mobile Number', 'Email Address'])

// [datum] => [datum_with_grouped_TabFields]
const groupTabFields = assign({ // reassign TabFields to new grouped TabFields
  TabFields: fork([
    fork({
      label: () => 'PERSONAL_INFORMATION',
      code: () => 'PERSONAL_INFORMATION',
      fields: pipe([
        get('TabFields'), // datum => datum.TabFields
        filter(pipe([ // FILTER: for each TabField of TabFields
          get('name'), // TabField => TabField.name
          field => PERSONAL_INFORMATION_FIELDS.has(field), // check if PERSONAL_INFORMATION_FIELDS has name
        ])),
      ]),
    }),
    fork({ // same as above but with contact details
      label: () => 'CONTACT_DETAILS',
      code: () => 'CONTACT_DETAILS',
      fields: pipe([
        get('TabFields'),
        filter(pipe([
          get('name'),
          field => CONTACT_DETAILS_FIELDS.has(field)
        ])),
      ]),
    }),
  ]),
})

x = map(groupTabFields)(data)

console.log(JSON.stringify(x, null, 2)) // output is what you wanted

I've added some comments, but for a deeper understanding of the library and code I've given you, I recommend reading the intuition and then reading the docs

Collectives™ on Stack Overflow

Sub-grouping array of objects inside of sub-array of main array

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related