How to push all objects of array2 to array1

Question

I want to push just the objects of array2 into array1.

array1 = [{name:'first'}, {name:'second'}];
array2 = [{name:'third'}, {name:'fourth'}, {name:'five'}];

// Desired result
array1 = [{name:'first'}, {name:'second'}, {name:'third'}, {name:'fourth'}, {name:'five'}];

copyArray() {
   this.array1.push( this.array2 ); 
   this.array2.splice();
}

When I run the copyArray function, the array2 itself was instead copied and not the objects. I got this:

Unwanted result

array1 = [{name:'first'}, {name:'second'}, [{name:'third'}, {name:'fourth'}, {name:'five'}]];

Can someone help me to fix this.

Does this answer your question? JavaScript: How to join / combine two arrays to concatenate into one array? — Alexander Staroselsky
– Alexander Staroselsky, Commented Dec 16, 2019 at 15:18

igg · Accepted Answer · 2019-12-16 15:28:01Z

3

The spread operator (...) makes this easy.

this.array1 = [...this.array1, ...this.array2];

edited Dec 16, 2019 at 15:28

answered Dec 16, 2019 at 15:18

igg

2,2803 gold badges13 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Christian Vincenzo Traina Over a year ago

About spread operator, you can use it also inside push: array1.push(...array2);

igg Over a year ago

Another thing to keep in mind is that push and concat don't change the reference and a lot of Angular change detection relies on variable reference changes for performance reasons. So, the value result of array1.push(...array2) and my answer above is the same. But mine also changes the reference, making it more likely to be picked up by Angular change detection.

Pleasure Over a year ago

I have actually tried this before but I was getteing red line under the array2. It was just an editor problem. However, this works thatnks, I think I need the change editor.

user11897373 Over a year ago

Just one observation: ...this.array1, ...this.array2 is different from ...this.array2, ...this.array1 when using the spread operator with objects, the order determines the result when they have a key with same name with different values

Adrita Sharma · Accepted Answer · 2019-12-16 15:18:23Z

1

Try like this:

Working Demo

  copyArray() {
    this.array2.forEach(item => {
      this.array1.push(item);
    });
    this.array2 = [];
  }

answered Dec 16, 2019 at 15:18

Adrita Sharma

22.3k11 gold badges75 silver badges85 bronze badges

4 Comments

Pleasure Over a year ago

Can you explain what this: this.array2 = []; does?

Adrita Sharma Over a year ago

I assumed you added this.array2.splice(); to clear array2. this.array2 = []; simply make this array empty

Pleasure Over a year ago

Thanks alot! I used to like your answers.

Adrita Sharma Over a year ago

You are welcome. The other answer is obviously better :)

Christian Vincenzo Traina · Accepted Answer · 2019-12-16 15:19:07Z

0

It's unclear what you attempted to do. If you want to concatenate two arrays, just use .concat:

const arr1 = [1, 2, 3];
const arr2 = [4, 5];
const arr3 = arr1.concat(arr2);

console.log('arr1', arr1); // unchanged
console.log('arr2', arr2); // unchanged
console.log('arr3', arr3);

answered Dec 16, 2019 at 15:19

Christian Vincenzo Traina

10.6k4 gold badges45 silver badges79 bronze badges

Comments

Sam · Accepted Answer · 2019-12-16 15:19:51Z

0

Proper Angular approach is to use combination, you can either use ForkJoin or Concat, more details on official site.

answered Dec 16, 2019 at 15:19

Sam

4905 silver badges21 bronze badges

Comments

Ali Adravi · Accepted Answer · 2019-12-16 15:56:50Z

0

Proper way is to use the concat function:

array2 = array1.concat(array2);

It can be use to merge two or more arrays like

var result = array1.concat(array2, array3, ..., arrayN);

answered Dec 16, 2019 at 15:56

Ali Adravi

23k9 gold badges93 silver badges97 bronze badges

Collectives™ on Stack Overflow

How to push all objects of array2 to array1

5 Answers 5

4 Comments

4 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

4 Comments

4 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related