150

This question is an exact duplicate of:
How to append an array to an existing JavaScript Array?

How do you append an array to another array in JavaScript?

Other ways that a person might word this question:

  • Add an array to another
  • Concat / Concatenate arrays
  • Extend an array with another array
  • Put the contents of one array into another array

I spent some time looking for the answer to this question. Sometimes the simplest ones like these are the hardest to find answers to, so I am adding the question here hopefully with plenty of key words and phrases as per this blog post. Please feel free to answer this question with any other helpful information or edit the key words and phrases below.

9
  • 8
    It is OK to answer your own question, it is not OK to put answer directly in the question itself. Please remove answer from the question, post it as an answer and self-accept it :-). Also, others might provide even better answers, outscoring yours ;-).CommentedMar 10, 2012 at 22:44
  • 2
    But questions should be answered with an answer, not in the question. But it's a dupe anyway, multiple times, so I'm voting to close. Searching for "javascript concatenate arrays" turned up quite a few hits anyway.CommentedMar 10, 2012 at 22:44
  • @Dave Newton: The problem is that if you don't know to use the keyword "concatenate", then you won't find anything. I think that is why it is difficult to find answers to the easier questions. Experts are like "just type this!". But people looking for answer to that question will not know to search using the keywords that an expert knows.CommentedMar 10, 2012 at 22:49
  • @Tomasz Nurkiewicz: I can move the answer to the answers section. However, I wanted to give other people an opportunity to answer the question and get points as opposed to generating points for myself.CommentedMar 10, 2012 at 22:51
  • @DutrowLLC "Append javascript array" returned mostly the same ones, including this one and one I posted above; append was your title/terminology. I'm somewhat sympathetic, but searching on either Google or SO would have turned those up. If I type your title in to a new question, it shows the latter of the above two as well.CommentedMar 10, 2012 at 23:26

1 Answer 1

186

If you want to modify the original array instead of returning a new array, use .push()...

array1.push.apply(array1, array2); array1.push.apply(array1, array3); 

I used .apply to push the individual members of arrays 2 and 3 at once.

or...

array1.push.apply(array1, array2.concat(array3)); 

To deal with large arrays, you can do this in batches.

for (var n = 0, to_add = array2.concat(array3); n < to_add.length; n+=300) { array1.push.apply(array1, to_add.slice(n, n+300)); } 

If you do this a lot, create a method or function to handle it.

var push_apply = Function.apply.bind([].push); var slice_call = Function.call.bind([].slice); Object.defineProperty(Array.prototype, "pushArrayMembers", { value: function() { for (var i = 0; i < arguments.length; i++) { var to_add = arguments[i]; for (var n = 0; n < to_add.length; n+=300) { push_apply(this, slice_call(to_add, n, n+300)); } } } }); 

and use it like this:

array1.pushArrayMembers(array2, array3); 

var push_apply = Function.apply.bind([].push); var slice_call = Function.call.bind([].slice); Object.defineProperty(Array.prototype, "pushArrayMembers", { value: function() { for (var i = 0; i < arguments.length; i++) { var to_add = arguments[i]; for (var n = 0; n < to_add.length; n+=300) { push_apply(this, slice_call(to_add, n, n+300)); } } } }); var array1 = ['a','b','c']; var array2 = ['d','e','f']; var array3 = ['g','h','i']; array1.pushArrayMembers(array2, array3); document.body.textContent = JSON.stringify(array1, null, 4);

12
  • 8
    this way sucks and doesnt work for >500 ish element arrays
    – ayla
    CommentedNov 20, 2013 at 17:33
  • 12
    tl;dr: array1 = [].concat(array1, array2, array3 /*, .. */); is better
    – Alex
    CommentedDec 4, 2014 at 18:12
  • 2
    @Alex: Fails to modify the original array, which is what the question is asking. And it's not better to use [].concat(... when you already have an array. It should be array1.concat(array2, array3).
    – user1106925
    CommentedDec 4, 2014 at 18:26
  • @squint point, but array1.concat(array2, array3) don't do it either as concat() returns a new array.
    – Alex
    CommentedDec 5, 2014 at 16:11
  • 2
    I like the answer from the duplicate question best: stackoverflow.com/questions/1374126/…CommentedAug 17, 2020 at 13:25

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.