Update multiple property name in array of objects

Question

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": {}
        }
      ]
    }

Don't use destructuring and ellipsis. Loop over the properties, and test if it's your list of names you want to replace. — Barmar, May 08 '23 at 17:26
Does this answer your question? [JavaScript: Object Rename Key](https://stackoverflow.com/questions/4647817/javascript-object-rename-key) — Mike Perrenoud, May 08 '23 at 17:32
your question is confusing, you want to do an update and your code do duplicates copy (with changing names) — Mister Jojo, May 08 '23 at 17:36
@MikePerrenoud: I know how to change the single property key. I am just looking for a way to do this dynamically for multiple property keys. — Shaggy, May 08 '23 at 17:39

score 0 · Answer 1 · answered May 08 '23 at 17:31

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.

score 0 · Answer 2 · answered May 08 '23 at 17:35

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 );

Pointy · Answer 3 · 2023-05-08T19:19:23.597

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.

Update multiple property name in array of objects

3 Answers3