Как я могу добавить новые элементы массива в начале массива в Javascript?

У меня есть необходимость добавлять или добавлять элементы в начале массива.

Например, если мой массив выглядит следующим образом:

[23, 45, 12, 67]

И ответ на мой вызов AJAX: 34я хочу, чтобы обновленный массив был таким:

[34, 23, 45, 12, 67]

В настоящее время я планирую сделать это так:

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

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

theArray = newArray;
delete newArray;

Есть ли лучший способ сделать это? Есть ли в Javascript какие-либо встроенные функции, которые это делают?

Сложность моего метода в том, O(n)и было бы очень интересно увидеть лучшие реализации.

Использование unshift. Это как push, за исключением того, что он добавляет элементы в начало массива вместо конца.

• unshift/ push- добавить элемент в начало / конец массива
• shift/ pop - удалить и вернуть первый / последний элемент массива

Простая схема ...

   unshift -> array <- push
   shift   <- array -> pop

и диаграмма:

          add  remove  start  end
   push    X                   X
    pop           X            X
unshift    X             X
  shift           X      X

Ознакомьтесь с документацией по массиву MDN . Практически каждый язык, который имеет возможность вставлять / извлекать элементы из массива, также будет иметь возможность отменять / сдвигать (иногда называемые push_front/ pop_front) элементы, вам никогда не придется реализовывать их самостоятельно.

Как указано в комментариях, если вы хотите избежать мутации вашего исходного массива, вы можете использовать concat, который объединяет два или более массивов вместе. Вы можете использовать это, чтобы функционально выдвинуть один элемент в начало или конец существующего массива; для этого вам нужно превратить новый элемент в массив из одного элемента:

const array = [ 3, 2, 1 ]

const newFirstElement = 4

const newArray = [newFirstElement].concat(array) // [ 4, 3, 2, 1 ]

concatМожно также добавлять элементы. Аргументы concatмогут быть любого типа; они неявно заключены в одноэлементный массив, если они еще не являются массивом:

const array = [ 3, 2, 1 ]

const newLastElement  = 0

// Both of these lines are equivalent:
const newArray1 = array.concat(newLastElement)   // [ 3, 2, 1, 0 ]
const newArray2 = array.concat([newLastElement]) // [ 3, 2, 1, 0 ]

С ES6 используйте оператор распространения ...:

DEMO

var arr = [23, 45, 12, 67];
arr = [34, ...arr]; // RESULT : [34,23, 45, 12, 67]

console.log(arr)

Еще один способ сделать это через concat

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

Разница между concatи в unshiftтом, что concatвозвращает новый массив. Представление между ними можно найти здесь .

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

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

Вот результат теста

Быстрый Cheatsheet:

Термины shift / unshift и push / pop могут быть немного запутанными, по крайней мере, для людей, которые могут быть не знакомы с программированием на C.

Если вы не знакомы с жаргоном, вот быстрый перевод альтернативных терминов, который может быть легче запомнить:

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

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

у вас есть массив: var arr = [23, 45, 12, 67];

Чтобы добавить элемент в начало, вы хотите использовать splice:

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

Без мутирования

На самом деле, все unshift/ pushи shift/ pop мутировать массив.

unshift/ pushДобавить элемент к существовавшему массиву из начала / конца и shift/pop удалить элемент из начала / конца массива.

Но есть несколько способов добавить элементы в массив без мутации. В результате получается новый массив, для добавления в конец массива используйте следующий код:

const originArray = ['one', 'two', 'three'];
const newItem = 4;

const newArray = originArray.concat(newItem); // ES5
const newArray2 = [...originArray, newItem]; // ES6+

Для добавления в начало оригинального массива используйте код ниже:

const originArray = ['one', 'two', 'three'];
const newItem = 0;

const newArray = (originArray.slice().reverse().concat(newItem)).reverse(); // ES5
const newArray2 = [newItem, ...originArray]; // ES6+

Вышеописанным способом вы добавляете в начало / конец массива без мутации.

Использование ES6 деструктуризации: (избегая мутации из исходного массива)

const newArr = [item, ...oldArr]

Если вам нужно постоянно вставлять элемент в начале массива, быстрее использовать pushоператоры с последующим вызовом reverseвместо того, чтобы вызывать unshiftвсе время.

Контрольный тест: http://jsben.ch/kLIYf

Используя, spliceмы вставляем элемент в массив в начале:

arrName.splice( 0, 0, 'newName1' );