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

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

[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), и было бы действительно интересно увидеть лучшие реализации.

1766
Moon 10 Ноя 2011 в 04:35

13 ответов

Лучший ответ

Используйте 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 Array. Практически каждый язык, который имеет возможность выталкивать / извлекать элементы из массива, будет также иметь возможность сдвигать / сдвигать (иногда называемые 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 ]
2766
meagar 16 Май 2019 в 13:23

array operations image

var a = [23, 45, 12, 67];
a.unshift(34);
console.log(a); // [34, 23, 45, 12, 67]
1383
Ruslan López 13 Сен 2016 в 00:43

Краткое описание:

Термины 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 ) 
44
dreftymac 23 Окт 2014 в 14:18

push() добавляет новый элемент в конец массива.
pop() удаляет элемент из конца массива.

unshift() добавляет новый элемент в начало массива.
shift() удаляет элемент из начала массива.

Использовать theArray.unshift(response)

13
Harunur Rashid 30 Май 2018 в 08:57

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

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

var arr = [23, 45, 12, 67];
arr.splice(0, 0, 34)
console.log(arr);
19
Ruslan López 13 Сен 2016 в 17:12

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

arrName.splice( 0, 0, 'newName1' );
4
Itay Grudev 12 Фев 2019 в 23:49
var array = [23, 45, 12, 67];  
array.unshift(11);  
alert(array);
11
Tiago Martins Peres 李大仁 9 Апр 2019 в 10:53

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

На самом деле все 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+

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

14
AmerllicA 10 Мар 2020 в 03:10

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

ДЕМО

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

console.log(arr)
226
Narendra Jadhav 13 Апр 2018 в 11:05
var testdata = new Array();
testdata = [23, 45, 12, 67];
testdata = [34, ...testdata]; 
console.log(testdata)
    
9
Tirkesh Turkesh 29 Май 2018 в 06:14

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

const newArr = [item, ...oldArr]

6
Ben Adam 6 Ноя 2019 в 17:09

Еще один способ сделать это через 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)
}

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

enter image description here

74
zangw 3 Ноя 2016 в 11:04

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

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

6
Jenny O'Reilly 7 Июн 2018 в 13:12