Renaming object properties in an array of objects

Question

I have the following structure:

const data = {
    invoices: [
        {
            Date: "2018-12-18T00:00:00.000Z",
            InvoiceNumber: "59"
        },
        {
            Date: "2018-12-18T00:00:00.000Z",
            InvoiceNumber: "59"
        }
    ]
};

I am wanting to re-name all instances of InvoiceNumber to CreditNoteNumber to give me the following:

const data = {
    invoices: [
        {
            Date: "2018-12-18T00:00:00.000Z",
            CreditNoteNumber: "59"
        },
        {
            Date: "2018-12-18T00:00:00.000Z",
            CreditNoteNumber: "59"
        }
    ]
};

I have tried various things like the following for example:

var changed = data.invoices.map(function(item) {
    return {
        ...data.invoices,
        CreditNoteNumber: item.InvoiceNumber
    };
});

However the spread pushes CreditNoteNumber outside the object.

Siva K V · Answer 1 · 2020-02-18T14:08:53.020

12

Just use destructure and rename

const data = {
  invoices: [
    {
      Date: "2018-12-18T00:00:00.000Z",
      InvoiceNumber: "59"
    },
    {
      Date: "2018-12-18T00:00:00.000Z",
      InvoiceNumber: "59"
    }
  ]
};

var changed = data.invoices.map(
  ({ Date, InvoiceNumber: CreditNoteNumber }) => ({ Date, CreditNoteNumber })
);

console.log(changed);

edited Feb 18 '20 at 14:08

answered Feb 18 '20 at 13:49

Siva K V

10,561
2
16
29

score 4 · Accepted Answer · answered Feb 18 '20 at 13:49

There is no such operation as "renaming" a property in JavaScript.

You will need to delete the property you no longer wish to keep:

const data = {
  invoices: [
    {
      Date: "2018-12-18T00:00:00.000Z",
      InvoiceNumber: "59"
    },
    {
      Date: "2018-12-18T00:00:00.000Z",
      InvoiceNumber: "59"
    }
  ]
};

const changed = data.invoices.map(item => {
  const obj = {
    ...item,
    CreditNoteNumber: item.InvoiceNumber
  };
  delete obj.InvoiceNumber
  return obj
});

console.log(changed)

@JimDover if you wanted to mutate the original object, a better approach is a simple `forEach`. — Ele, Feb 18 '20 at 14:15

score 2 · Answer 3 · edited Feb 18 '20 at 14:13

2

var changed = data.invoices.map(function(item) {
  return {
    Date: item.Date,
    CreditNoteNumber: item.InvoiceNumber
  };
});

edited Feb 18 '20 at 14:13

sdgluck

24,894
8
75
90

answered Feb 18 '20 at 13:53

willystyle

209
1
5

Ele · Answer 4 · 2020-02-18T14:18:24.853

You can use the function map along with the function Object.assign as follow:

The following approach doesn't mutate the original object

const data = {invoices: [{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"},{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"}]},
      result = data.invoices.map(({InvoiceNumber: CreditNoteNumber, ...items}) => Object.assign({}, items, {CreditNoteNumber}));

console.log(result);

If you want to mutate the original object, you can use a forEach instead:

const data = {invoices: [{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"},{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"}]};

data.invoices.forEach((item) => {
  item.CreditNoteNumber = item.InvoiceNumber;
  delete item.InvoiceNumber;
});

console.log(data);

score 1 · Answer 5 · answered Feb 18 '20 at 14:47

the best option is to create a new object with the property item.CreditNoteNumber and use a for each loop to iterate and reassign the values to the new object.

once the new object is created, assign the new object to the original object data.invoices.

const data = {invoices: [{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"},{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"}]};

var newInvoices = [];

data.invoices.forEach((item) => {
 let invoice = {};
     invoice.Date = item.Date;
     invoice.CreditNoteNumber = item.InvoiceNumber;

  newInvoice.push(invoice);
});

data.invoices = newInvoices;

console.log(data.invoices);

Renaming object properties in an array of objects

5 Answers5