Question 160362 in Javascript Question posted in
A very good W3school tutorial can be found here.

Can Javascript update multiple property names in an array of objects?

Here is what my object looks like:

let myObj = {
  "Accounts": [
    {
      "Type": "Card",
      "CreditCard": {}
    },
    {
      "Type": "ACH",
      "CreditCard": {}
    },
    {
      "Type": "CDA",
      "Checking": {}
    },
    {
      "Type": "INTL",
      "Mortgage": {}
    }
  ]
}

I’d like to change the property name from CreditCard,Checking,Mortgage to something common such as FinanceRecord. I know I can do something like below

let temp = myObj.map(({ CreditCard: FinanceRecord, ...item }) => ({
              FinanceRecord,
              ...item,
            }));
// Specify each property name...
myObj.map(({ Checking: FinanceRecord, ...item }) => ({
                  FinanceRecord,
                  ...item,
                }));

Is there any better way to do this? I have about 20 different property names which I want to update. Thanks!

Edit:

Expected Output:

let myObj = {
      "Accounts": [
        {
          "Type": "Card",
          "FinanceRecord": {}
        },
        {
          "Type": "ACH",
          "FinanceRecord": {}
        },
        {
          "Type": "CDA",
          "FinanceRecord": {}
        },
        {
          "Type": "INTL",
          "FinanceRecord": {}
        }
      ]
    }
Tags:

4

Answers


  1. 0

    Yes, there is a more concise way to achieve this using the Object.entries() and Array.map() methods. Here’s how you can update all the properties named CreditCard, Checking, and Mortgage to FinanceRecord:

    let myObj = {
  "Accounts": [
    {
      "Type": "Card",
      "CreditCard": {}
    },
    {
      "Type": "ACH",
      "CreditCard": {}
    },
    {
      "Type": "CDA",
      "Checking": {}
    },
    {
      "Type": "INTL",
      "Mortgage": {}
    }
  ]
}

myObj.Accounts = myObj.Accounts.map(account => {
  const updatedRecord = {}
  for (const [key, value] of Object.entries(account)) {
    updatedRecord[key === 'CreditCard' || key === 'Checking' || key === 'Mortgage' ? 'FinanceRecord' : key] = value
  }
  return updatedRecord
})

    In the above code, Object.entries(account) returns an array of key-value pairs for each property of the current account object. We then loop through each key-value pair using a for...of loop, and check if the key is one of the property names we want to update. If it is, we update the key to "FinanceRecord" in the updatedRecord object. If it’s not, we leave the key as is. Finally, we return the updatedRecord object for each account using the Array.map() method.

    Login or Signup to reply.
  2. 0

    If the Type of the item specifies what the other property name will be, then you can use a map to do "dynamic destructuring"

    let myObj = {
  "Accounts": [
    { "Type": "Card", "CreditCard": {} },
    { "Type": "ACH", "CreditCard": {} },
    { "Type": "CDA", "Checking": {} },
    { "Type": "INTL", "Mortgage": {} }
  ]
}

const typeProperty = {
  Card: "CreditCard",
  ACH: "CreditCard",
  CDA: "Checking",
  INTL: "Mortgage"
}

const temp = myObj.Accounts.map(({
  Type,
  [typeProperty[Type]]:FinanceRecord,
  ...rest
}) => ({
    ...rest,
    Type,
    FinanceRecord
}));

console.log( temp );
    Login or Signup to reply.
  3. 0

    a way to do this UPDATE

    myObj.Accounts.forEach( (o,i,Arr) => 
  {
  Object.assign( Arr[i], { FinanceRecord : o.CreditCard || o.Checking || o.Mortgage }  ) 
  delete Arr[i].CreditCard
  delete Arr[i].Checking
  delete Arr[i].Mortgage
  });

    test

    const myObj = 
  { Accounts: 
    [ { Type: 'Card', CreditCard: {} } 
    , { Type: 'ACH',  CreditCard: {} } 
    , { Type: 'CDA',  Checking:   {} } 
    , { Type: 'INTL', Mortgage:   {} } 
    ] 
  } 

myObj.Accounts.forEach( (o,i,Arr) => 
  {
  Object.assign( Arr[i], { FinanceRecord : o.CreditCard || o.Checking || o.Mortgage }  ) 
  delete Arr[i].CreditCard
  delete Arr[i].Checking
  delete Arr[i].Mortgage
  });

console.log( myObj )
    .as-console-wrapper {max-height: 100% !important;top: 0;}
    Login or Signup to reply.
  4. 0

    You can do this without any destructuring (and therefore without making whole new objects) by adding the desired new property name and then deleting the old one:

    function update(obj, nameMap) {
  Object.entries(obj).forEach(p {
    if (p[0] in nameMap) {
      obj[nameMap[p[0]] = p[1];
      delete obj[p[0]];
    }
  }
}

    Then:

    update(myObj.Accounts, {
  CreditCard: "FinanceRecord",
  Checking: "FinanceRecord",
  Mortgage: "FinanceRecord"
});

    Now in the interest of full disclosure, deleting properties probably blows away per-object internal optimizations that the runtime has done before that point. Well, maybe it does.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search