Push multiple elements to array

Javascript

Javascript Problem Overview


I'm trying to push multiple elements as one array, but getting an error:

> a = []
[]
> a.push.apply(null, [1,2])
TypeError: Array.prototype.push called on null or undefined

I'm trying to do similar stuff that I'd do in ruby, I was thinking that apply is something like *.

>> a = []
=> []
>> a.push(*[1,2])
=> [1, 2]

Javascript Solutions


Solution 1 - Javascript

You can push multiple elements into an array in the following way

var a = [];
    
a.push(1, 2, 3);

console.log(a);

Solution 2 - Javascript

Now in ECMAScript2015 (a.k.a. ES6), you can use the spread operator to append multiple items at once:

var arr = [1];
var newItems = [2, 3];
arr.push(...newItems);
console.log(arr);

See Kangax's ES6 compatibility table to see what browsers are compatible

Solution 3 - Javascript

When using most functions of objects with apply or call, the context parameter MUST be the object you are working on.

In this case, you need a.push.apply(a, [1,2]) (or more correctly Array.prototype.push.apply(a, [1,2]))

Solution 4 - Javascript

You can use Array.concat:

var result = a.concat(b);

Solution 5 - Javascript

If you want to add multiple items, you have to use the spread operator

a = [1,2]
b = [3,4,5,6]
a.push(...b)

The output will be

a = [1,2,3,4,5,6]

Solution 6 - Javascript

If you want an alternative to Array.concat in ECMAScript 2015 (a.k.a. ES6, ES2015) that, like it, does not modify the array but returns a new array you can use the spread operator like so:

var arr = [1];
var newItems = [2, 3];
var newerItems = [4, 5];
var newArr = [...arr, ...newItems, ...newerItems];
console.log(newArr);

Note this is different than the push method as the push method mutates/modifies the array.

If you want to see if certain ES2015 features work in your browser check Kangax's compatibility table.

You can also use Babel or a similar transpiler if you do not want to wait for browser support and want to use ES2015 in production.

Solution 7 - Javascript

There are many answers recommend to use: Array.prototype.push(a, b). It's nice way, BUT if you will have really big b, you will have stack overflow error (because of too many args). Be careful here.

See https://stackoverflow.com/questions/5080028/what-is-the-most-efficient-way-to-concatenate-n-arrays for more details.

Solution 8 - Javascript

Easier way is

a = []
a.push(1,2,3)

Another way is

a = [...a, 4,5,6]

if you want to create another array

const b = a.concat(7,8,9)

Solution 9 - Javascript

I had the same doubt and in my case, an easier solution worked for me:

let array = []
array.push(1, 2, 4, "string", new Object())
console.log(array)
// logs [ 1, 2, 4, 'string', {} ]

Solution 10 - Javascript

Pushing multiple objects at once often depends on how are you declaring your array.

This is how I did

//declaration
productList= [] as  any;

now push records

this.productList.push(obj.lenght, obj2.lenght, items);

Solution 11 - Javascript

Option 1: Using concat(): It takes extra space as it returns a new array.

let array1=['a','b']
let array2=['c','d']
let array3=['e','f']
let res=array1.concat(array2,array3)

Option 2: Using spread operator: Doesn't takes extra space and operates on the same array.

let array1=['a','b']
let array2=['c','d']
let array3=['e','f']
array1.push(...array2,...array3)

Solution 12 - Javascript

Please use ES6 spread operator:

let a = [1,2,3];
let b = [4,5,6];
a = [...a,...b];
// [1,2,3,4,5,6]

Solution 13 - Javascript

var a=[];
a.push({
 name_a:"abc",
 b:[]
});

a.b.push({
  name_b:"xyz"
});

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionevfwcqcgView Question on Stackoverflow
Solution 1 - Javascriptamit1310View Answer on Stackoverflow
Solution 2 - JavascriptcanacView Answer on Stackoverflow
Solution 3 - JavascriptNiet the Dark AbsolView Answer on Stackoverflow
Solution 4 - JavascriptVisioNView Answer on Stackoverflow
Solution 5 - JavascriptNikhil YadavView Answer on Stackoverflow
Solution 6 - JavascriptJohnView Answer on Stackoverflow
Solution 7 - Javascript12kbView Answer on Stackoverflow
Solution 8 - JavascriptMD SHAYONView Answer on Stackoverflow
Solution 9 - JavascriptJose VelascoView Answer on Stackoverflow
Solution 10 - JavascriptR15View Answer on Stackoverflow
Solution 11 - JavascriptsakigoView Answer on Stackoverflow
Solution 12 - JavascriptVrienden van AndriesView Answer on Stackoverflow
Solution 13 - JavascriptAlex KumbhaniView Answer on Stackoverflow