Array of objects (JS) - How to copy the content of the first object into the second one?

Question

I have a HTML form with three input fields, and I need to make some replacements of their values.

So I wrote the following code (HTML part is omitted):

var fields = [];
fields[0] = 'aaa bbb ccc';
fields[1] = 'aaa bbb ccc ddd';
fields[2] = 'eee';

const array = [
{
    'aaa': 'AAA',
    'bbb': 'BBB',
    'ccc': 'CCC'
},
{
    'ddd': 'DDD'
},
{
    'eee': 'EEE'
}
];

for (var i in array) {
    for (var k in array[i]) {
        fields[i] = fields[i].replace(RegExp(k, 'g'), array[i][k]);
        // I can't use replaceAll, because I need to support old browsers
    }
};

As you can see, in the 2nd field I have to make the same replacements than in the 1st one (aaa bbb ccc), plus another one (ddd).

How can I copy (extend?) the content of the first object into the second one?

In other words, the content of the second object should become:

{
    'aaa': 'AAA',
    'bbb': 'BBB',
    'ccc': 'CCC',
    'ddd': 'DDD'
}

I'm new to JS objects, so my terminology could be inaccurate. But I hope my problem is clear.

@AbsoluteBeginner I didn't downvote but it feels like homework. You have not shown any research to solve this yourself. — jods, Feb 20 '21 at 21:14
@jods This is NOT a homework, I'm NOT a student. I'm writing an app for myself and I need to solve that problem. And I've done many researches (here on SO too) before asking my question. — AbsoluteBeginner, Feb 20 '21 at 21:16
@AbsoluteBeginner adding "THIS IS NOT HOMEWORK" isn't the solution. Two tips: 1) isolate the specific question/problem you have. Here I assume you know how to access an array, so make the question "How to copy an object into another one". 2) it's ok to ask basic questions but show a little research, what you've tried so far. Searching for "How to copy a javascript object into another one" on SO has many results, e.g.: https://stackoverflow.com/questions/9362716/how-to-duplicate-object-properties-in-another-object which has `Object.assign` in its answer making this Q a duplicate. — jods, Feb 20 '21 at 21:34

score 2 · Accepted Answer · answered Feb 20 '21 at 21:06

2

You can use JavaScript's Spread syntax:

const array = [{
    'aaa': 'AAA',
    'bbb': 'BBB',
    'ccc': 'CCC'
  },
  {
    'ddd': 'DDD'
  }
];

array[1] = {...array[0], ...array[1]}

console.log(array);

answered Feb 20 '21 at 21:06

DjaouadNM

22,013
4
33
55

Majed Badawi · Answer 2 · 2021-02-20T21:08:48.910

1

Try this:

const array = [
  { 'aaa': 'AAA', 'bbb': 'BBB', 'ccc': 'CCC' },
  { 'ddd': 'DDD' }
];

array[1] = { ...array[0], ...array[1] };

console.log(array);

edited Feb 20 '21 at 21:08

answered Feb 20 '21 at 21:05

Majed Badawi

27,616
4
25
48

This doesn't satisfy the requirements as it creates a new object rather than mutate the 2nd one. – jods Feb 20 '21 at 21:07
You changed your answer but it's still not exactly "changing the contents of the 2nd object", it's "changing the contents of the array". I interpret the question as asking for `Object.assign`. – jods Feb 20 '21 at 21:10
@jods I agree ``Object.assign`` is useful here, but this solution changes the array element as requested by OP not the array, so both do the job – Majed Badawi Feb 20 '21 at 21:17
That might do the job as the Q isn't super precise, it's not how I'd strictly understand "changing _the contents_ of the second object", which to me means _mutate the object._ In any case you may want to put `array[1]` first in your spread because otherwise if they share common keys the first one would not be copied into the second one, which is what is asked. – jods Feb 20 '21 at 21:21
@jods the expected output shows that the properties of the first object should be put first, and probably the values from ``array[1]`` should be preserved – Majed Badawi Feb 20 '21 at 21:24

Array of objects (JS) - How to copy the content of the first object into the second one?

2 Answers2