How can I add new array elements at the beginning

Question

I have a need to add or prepend elements at the beginning of an array.

For example, if my array looks like below:

[23, 45, 12, 67]

And the response from my AJAX call is 34, I want the updated array to be like the following:

[34, 23, 45, 12, 67]

Currently I am planning to do it like this:

var newArray = [];
newArray.push(response);

for (var i = 0; i < theArray.length; i++) {
    newArray.push(theArray[i]);
}

theArray = newArray;
delete newArray;

Is there any better way to do this? Does Javascript have any built-in functionality that does this?

The complexity of my method is O(n) and it would be really interesting to see better implementations.

Answer 1

you have an array: var arr = [23, 45, 12, 67];

To add an item to the beginning, you want to use splice:

var arr = [23, 45, 12, 67];
arr.splice(0, 0, 34)
console.log(arr);

Answer 2

If you need to continuously insert an element at the beginning of an array, it is faster to use push statements followed by a call to reverse, instead of calling unshift all the time.

Benchmark test: http://jsben.ch/kLIYf

Answer 3

Another way to do that through concat

var arr = [1, 2, 3, 4, 5, 6, 7];
console.log([0].concat(arr));

The difference between concat and unshift is that concat returns a new array. The performance between them could be found here.

function fn_unshift() {
  arr.unshift(0);
  return arr;
}

function fn_concat_init() {
  return [0].concat(arr)
}

Here is the test result

Answer 4

Quick Cheatsheet:

The terms shift/unshift and push/pop can be a bit confusing, at least to folks who may not be familiar with programming in C.

If you are not familiar with the lingo, here is a quick translation of alternate terms, which may be easier to remember:

* array_unshift()  -  (aka Prepend ;; InsertBefore ;; InsertAtBegin )     
* array_shift()    -  (aka UnPrepend ;; RemoveBefore  ;; RemoveFromBegin )

* array_push()     -  (aka Append ;; InsertAfter   ;; InsertAtEnd )     
* array_pop()      -  (aka UnAppend ;; RemoveAfter   ;; RemoveFromEnd ) 

Answer 5

Without Mutate

Actually, all unshift/push and shift/pop mutate the origin array.

The unshift/push add an item to the existed array from begin/end and shift/pop remove an item from the beginning/end of an array.

But there is a way to add items to an array without a mutation. the result is a new array, to add to end of array use below code:

const originArray = ['one', 'two', 'three'];
const newItem = 4;
const newArray = originArray.concat(newItem);

To add to begin of original array use below code:

const originArray = ['one', 'two', 'three'];
const newItem = 0;
const newArray = (originArray.reverse().concat(newItem)).reverse();

With the above way, you add to the beginning/end of an array without a mutation.