How to change the keys in nested array of objects

Question

Following is my array, and I need to replace the keys name with title and Email with subtitle.

I tried some ways, but I still need to fulfill my requirement. Please provide any solution to this.

const newUpdatedList = [];
resArr.forEach((res) => {
  const obj = {
    title: res.name,
    subtitle: res.attributes.Email
  };

  if (res.children) {
    const newList = res.children.map((ch) => {
      return {
        title: ch.name,
        subtitle: ch.attributes.Email,
      };
    });
    obj.children = newList;
  }
  newUpdatedList.push(obj);
});

const resArr = 
  [ { user_id    : 'f7ba4795-d279-4c38-9a84-7a49522c50a2'
    , name       : 'Harsha ABC'
    , custom_id  : 'mani78989-1gfqv04bo'
    , attributes : { Email: 'harsha@gmail.com', Role: 'admin'} 
    , children: 
      [ { user_id    : 'd748037a-b445-41c2-b82f-4d6ee9396714'
        , name       : 'Lavaraju Allu'
        , custom_id  : 'mani78989-1gfqv472q'
        , attributes : { Email: 'raju@gmail.com', Role: 'Manager'} 
        , children: 
          [ { user_id    : '881c7731-b853-4ebc-b271-8f9e9215f7a1'
            , name       : 'Ramesh Allu'
            , custom_id  : 'mani78989-1gh14i13t'
            , attributes : { Email: 'ramesh@gmail.com', Role: 'Retailer'} 
            , children: 
              [ { user_id    : 'f7ba4795-d279-4c38-9a84-7a49522c50a2'
                , name       : 'Harsha ABC'
                , custom_id  : 'mani78989-1gh15nrev'
                , attributes : { Email: 'harsha@gmail.com', Role: 'Delivery Manager'} 
                , children   : [] 
        } ] } ] } 
      , { user_id    : '550cc296-d7e4-44fb-9d62-4c6755b3f6f2'
        , name       : 'Suresh Kunisetti'
        , custom_id  : 'mani78989-1gfqv6idi'
        , attributes : { Email: 'suresh@gmail.com', Role: 'Super Admin'} 
        , children: 
          [ { user_id    : '45cf19f8-36c1-4669-9333-1226c4f7b66b'
            , name       : 'Harish Three'
            , custom_id  : 'mani78989-1ggv5vffb'
            , attributes : { Email: 'harish234@gmail.com', Role: 'Delivery Manager'} 
            , children   : [] 
        } ] } 
      , { user_id    : '2c8535be-5fe7-40f0-892f-0f9bcffe0baa'
        , name       : 'Sandeep Bbb'
        , custom_id  : 'mani78989-1gh14m5p4'
        , attributes : { Email: 'sandeep@gmail.com', Role: 'Delivery Manager'} 
        , children   : [] 
        } 
      , { user_id    : '881c7731-b853-4ebc-b271-8f9e9215f7a1'
        , name       : 'Ramesh Allu'
        , custom_id  : 'mani78989-1gh14pc6p'
        , attributes : { Email: 'ramesh@gmail.com', Role: 'Manager'} 
        , children   : [ ] 
    } ] } 
  ]

Expected output is

const resArr = 
  [ { user_id    : 'f7ba4795-d279-4c38-9a84-7a49522c50a2'
    , title      : 'Harsha ABC'
    , custom_id  : 'mani78989-1gfqv04bo'
    , attributes : { subtitle: 'harsha@gmail.com', Role: 'admin'} 
    , children: 
      [ { user_id    : 'd748037a-b445-41c2-b82f-4d6ee9396714'
        , title      : 'Lavaraju Allu'
        , custom_id  : 'mani78989-1gfqv472q'
        , attributes : { subtitle: 'raju@gmail.com', Role: 'Manager'} 
        , children: 
          [ { user_id    : '881c7731-b853-4ebc-b271-8f9e9215f7a1'
            , title      : 'Ramesh Allu'
            , custom_id  : 'mani78989-1gh14i13t'
            , attributes : { subtitle: 'ramesh@gmail.com', Role: 'Retailer'} 
            , children: 
              [ { user_id    : 'f7ba4795-d279-4c38-9a84-7a49522c50a2'
                , title      : 'Harsha ABC'
                , custom_id  : 'mani78989-1gh15nrev'
                , attributes : { subtitle: 'harsha@gmail.com', Role: 'Delivery Manager'} 
                , children   : [] 
        } ] } ] } 
      , { user_id    : '550cc296-d7e4-44fb-9d62-4c6755b3f6f2'
        , title      : 'Suresh Kunisetti'
        , custom_id  : 'mani78989-1gfqv6idi'
        , attributes : { subtitle: 'suresh@gmail.com', Role: 'Super Admin'} 
        , children: 
          [ { user_id    : '45cf19f8-36c1-4669-9333-1226c4f7b66b'
            , title      : 'Harish Three'
            , custom_id  : 'mani78989-1ggv5vffb'
            , attributes : { subtitle: 'harish234@gmail.com', Role: 'Delivery Manager'} 
            , children   : [] 
        } ] } 
      , { user_id    : '2c8535be-5fe7-40f0-892f-0f9bcffe0baa'
        , title      : 'Sandeep Bbb'
        , custom_id  : 'mani78989-1gh14m5p4'
        , attributes : { subtitle: 'sandeep@gmail.com', Role: 'Delivery Manager'} 
        , children   : [] 
        } 
      , { user_id    : '881c7731-b853-4ebc-b271-8f9e9215f7a1'
        , title      : 'Ramesh Allu'
        , custom_id  : 'mani78989-1gh14pc6p'
        , attributes : { subtitle: 'ramesh@gmail.com', Role: 'Manager'} 
        , children   : [] 
    } ] } 
  ]

What do you expect ? 1) create a new Object or update your object ? a code for this specifc object, or a géneric code for all kind of object, with a generics list of names to change ? — Mister Jojo, Dec 03 '22 at 19:29

score 1 · Answer 1 · answered Dec 03 '22 at 19:24

Here's a recursive solution.

const resArr= [{"user_id": "f7ba4795-d279-4c38-9a84-7a49522c50a2","name": "Harsha ABC","custom_id": "mani78989-1gfqv04bo","attributes": {"Email": "harsha@gmail.com","Role": "admin"},"children": [{"user_id": "d748037a-b445-41c2-b82f-4d6ee9396714","name": "Lavaraju Allu","custom_id": "mani78989-1gfqv472q","attributes": {"Email": "raju@gmail.com","Role": "Manager"},"children": [{"user_id": "881c7731-b853-4ebc-b271-8f9e9215f7a1","name": "Ramesh Allu","custom_id": "mani78989-1gh14i13t","attributes": {"Email": "ramesh@gmail.com","Role": "Retailer"},"children": [{"user_id": "f7ba4795-d279-4c38-9a84-7a49522c50a2","name": "Harsha ABC","custom_id": "mani78989-1gh15nrev","attributes": {"Email": "harsha@gmail.com","Role": "Delivery Manager"},"children": []}]}]},{"user_id": "550cc296-d7e4-44fb-9d62-4c6755b3f6f2","name": "Suresh Kunisetti","custom_id": "mani78989-1gfqv6idi","attributes": {"Email": "suresh@gmail.com","Role": "Super Admin"},"children": [{"user_id": "45cf19f8-36c1-4669-9333-1226c4f7b66b","name": "Harish Three","custom_id": "mani78989-1ggv5vffb","attributes": {"Email": "harish234@gmail.com","Role": "Delivery Manager"},"children": []}]},{"user_id": "2c8535be-5fe7-40f0-892f-0f9bcffe0baa","name": "Sandeep Bbb","custom_id": "mani78989-1gh14m5p4","attributes": {"Email": "sandeep@gmail.com","Role": "Delivery Manager"},"children": []},{"user_id": "881c7731-b853-4ebc-b271-8f9e9215f7a1","name": "Ramesh Allu","custom_id": "mani78989-1gh14pc6p","attributes": {"Email": "ramesh@gmail.com","Role": "Manager"},"children": []}]}]

function changeTitles(Obj){
  Obj.title = Obj.name;
  Obj.attributes.subtitle = Obj.attributes.Email;
  delete Obj.name;
  delete Obj.attributes.Email;
  if (Obj.children) {
    Obj.children.forEach(changeTitles)
  }
}

const clone = JSON.parse(JSON.stringify(resArr)) // Because the function mutates the object
clone.forEach(changeTitles)

console.log(clone)

Carsten Massmann · Answer 2 · 2022-12-03T19:42:50.987

I was a little late with my answer, so it looks like a copy of Brother58697's answer. The only difference is maybe the structuredClone() method, a newish global method:

const resArr= [ { "user_id": "f7ba4795-d279-4c38-9a84-7a49522c50a2", "name": "Harsha ABC", "custom_id": "mani78989-1gfqv04bo", "attributes": { "Email": "harsha@gmail.com", "Role": "admin" }, "children": [ { "user_id": "d748037a-b445-41c2-b82f-4d6ee9396714", "name": "Lavaraju Allu", "custom_id": "mani78989-1gfqv472q", "attributes": { "Email": "raju@gmail.com", "Role": "Manager" }, "children": [ { "user_id": "881c7731-b853-4ebc-b271-8f9e9215f7a1", "name": "Ramesh Allu", "custom_id": "mani78989-1gh14i13t", "attributes": { "Email": "ramesh@gmail.com", "Role": "Retailer" }, "children": [ { "user_id": "f7ba4795-d279-4c38-9a84-7a49522c50a2", "name": "Harsha ABC", "custom_id": "mani78989-1gh15nrev", "attributes": { "Email": "harsha@gmail.com", "Role": "Delivery Manager" }, "children": [] } ] } ] }, { "user_id": "550cc296-d7e4-44fb-9d62-4c6755b3f6f2", "name": "Suresh Kunisetti", "custom_id": "mani78989-1gfqv6idi", "attributes": { "Email": "suresh@gmail.com", "Role": "Super Admin" }, "children": [ { "user_id": "45cf19f8-36c1-4669-9333-1226c4f7b66b", "name": "Harish Three", "custom_id": "mani78989-1ggv5vffb", "attributes": { "Email": "harish234@gmail.com", "Role": "Delivery Manager" }, "children": [] } ] }, { "user_id": "2c8535be-5fe7-40f0-892f-0f9bcffe0baa", "name": "Sandeep Bbb", "custom_id": "mani78989-1gh14m5p4", "attributes": { "Email": "sandeep@gmail.com", "Role": "Delivery Manager" }, "children": [] }, { "user_id": "881c7731-b853-4ebc-b271-8f9e9215f7a1", "name": "Ramesh Allu", "custom_id": "mani78989-1gh14pc6p", "attributes": { "Email": "ramesh@gmail.com", "Role": "Manager" }, "children": [] } ] } ];

function trans(arr){
 arr.forEach((o)=>{
  o.title=o.name; delete(o.name);
  o.attributes.subtitle=o.attributes.Email; delete(o.attributes.Email);
  trans(o.children)
 })
}
let result=structuredClone(resArr);
trans(result);
console.log(result);

Mussemou · Accepted Answer · 2022-12-03T20:41:24.030

You can use the recursive function that I created. This function is taking in an object that looks like sample_obj and then recreates the resArr where name is title and email is subtitle. Take a look:

function recursive_fix(obj) {
  const sample_obj = {
    user_id: obj.user_id,
    title: obj.name,
    custom_id: obj.custom_id,
    attributes: {subtitle: obj.attributes.Email, Role: obj.attributes.Role},
    children: []
  };
  
  // only adding recursive if the children array is not empty
  if (obj.children.length !== 0) {
    obj.children.forEach((childz) => {
      sample_obj.children.push({children: [recursive_fix(childz)]})
    })
  }

  return sample_obj
};

const newUpdatedList = [];
resArr.forEach((res) => {
    newUpdatedList.push(recursive_fix(res))
})

score 0 · Answer 4 · answered Dec 03 '22 at 19:16

I am not 100% sure I understand correctly what you're trying to do, but it seems you are trying to change the key names in an array of objects. Let me know if this is wrong. Something like this would work in that case"

const arrayOfObj = [{
    name: 'value1',
    email: 'value2'
  }, {
    name: 'value1',
    email: 'value2'
  }];
  const newArrayOfObj = arrayOfObj.map(({
    name: title,
    email: subtitle,
    ...rest
  }) => ({
    title,
    subtitle,
    ...rest
  }));
  
  console.log(newArrayOfObj);

found this answer here

score 0 · Answer 5 · answered Dec 03 '22 at 19:23

A quick solution could be to stringify, string replace and parse back to object/array. Something like this:

const asString = JSON.stringify(resArr);
const replacedNames = asString.replace(/name/g, "title");
const replacedEmail = replacedNames.replace(/Email/g, "subtitle");
const result = JSON.parse(replacedEmail);

the changed object/array is in result.

score 0 · Answer 6 · answered Dec 03 '22 at 19:37

0

One of the Simplest way we can use is to use Object.assign something like this:

a={'name': 'xyz', 'Email': 'xyz@gmail.com'};
b= Object.assign({'title': a.name, 'subtitle': a.Email});

answered Dec 03 '22 at 19:37

mukhtar alam

195
1
12

How to change the keys in nested array of objects

6 Answers6