Питання Як додати щось до масиву?


Як додати об'єкт (наприклад, рядок або номер) до масиву в JavaScript?


2880


походження




Відповіді:


Використовувати push() функція додати до масиву:

// initialize array
var arr = [
    "Hi",
    "Hello",
    "Bonjour"
];

// append new value to the array
arr.push("Hola");

console.log(arr);

Буде друкувати

["Hi", "Hello", "Bonjour", "Hola"]

Ви можете скористатись push() функція додавання декількох значень масиву в один виклик:

// initialize array
var arr = [ "Hi", "Hello", "Bonjour", "Hola" ];

// append multiple values to the array
arr.push("Salut", "Hey");

// display all values
for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

Буде друкувати

Hi
Hello
Bonjour
Hola 
Salut
Hey

Оновити

Якщо ви хочете додати елементи одного масиву до іншого масиву, ви можете використовувати firstArray.concat(secondArray):

var arr = [
    "apple",
    "banana",
    "cherry"
];

arr = arr.concat([
    "dragonfruit",
    "elderberry",
    "fig"
]);

console.log(arr);

Буде друкувати

["apple", "banana", "cherry", "dragonfruit", "elderberry", "fig"]

3386



Зверніть увагу, що повернене значення .push - це не масив (або новий, наприклад .concat), а ціле число, що представляє нову довжину масиву. - Jay
@ RST: не використовуйте for взагалі (використовувати .forEach) - Robert Siemer
Я б сказав, що оригінальний код просто чудово. Немає потреби в тому, щоб оптимізувати доступ до length власність Перекладач робить дивовижну роботу саме в цьому самому, і це не буде мати ніякої різниці в реальному світі, незалежно від того, оптимізувати його чи ні. Якщо ваш масив стає настільки великим, що оптимізує .length насправді допоможе, найімовірніше, масив не є правильною структурою даних. Використовуючи forEachмає свої переваги, але це дуже сумнівно, що підвищення продуктивності буде одним з них, оскільки функція закликає до кожної ітерації несе витрати і нічого не заощаджує. - Stijn de Witt
@ RobertSiemer The length властивість масиву не обчислюється кожного разу, коли ви називаєте це, це змінна, що зберігається в array об'єкт, який оновлюється тільки при зміні масиву. Таким чином, насправді немає витрат на продуктивність в тому числі arr.length в for умова - mikeyq6
@Мозімі Як початківець ігноруйте будь-які поради, які стосуються питань продуктивності в таких випадках, як цей. Використовуйте більш виразний синтаксис. З плином часу роботи Javascript додають все більше і більше оптимізацій - вони будуть вбудовані forEach функції зворотного виклику (деякі з них, ймовірно, вже це роблять), і не буде ніякої відмінності в генерованому машинному коді, якщо функція називається досить часто для складання замість інтерпретації runtime. Така ж порада стосується будь-якої мови, яка не є асемблером, насправді. - Mörre


Якщо ви додаєте тільки одну змінну, то push() працює нормально. Якщо вам потрібно додати інший масив, використовуйте concat():

var ar1 = [1, 2, 3];
var ar2 = [4, 5, 6];

var ar3 = ar1.concat(ar2);

alert(ar1);
alert(ar2);
alert(ar3);

Виплесне:

"1,2,3"
"4,5,6"
"1,2,3,4,5,6"

Конкат не впливає ar1 і ar2 якщо не перепризначено, наприклад:

ar1 = ar1.concat(ar2);
alert(ar1);

Буде відображено:

"1,2,3,4,5,6"

Багато чудової інформації тут


954



Просто переконайтеся, що люди витягують var ar3 = ar1.concat (ar2); частина ar1.concat (ar2) не зберігає значення в ar1. Ви повинні спіймати це, поставивши його на ar3 або назад до ar1, наприклад: ar1 = ar1.concat (ar2); - vbullinger
Я б сказав, що це неправильна відповідь насправді. Питання було How do I append to an array in JavaScript?, але concat насправді створює a новий масив Це важлива відмінність! Натомість, я б сказав, що відповідь нижче Omnimike насправді найкраща: Використовуйте Push.apply щоб підштовхнути весь масив до існуючого масиву, не створюючи нового. - Stijn de Witt
@StijndeWitt ви можете додати без створення нового масиву, як зазначено у попередньому коменті ar1 = ar1.concat(ar2); додати до ar1 - cameronjonesweb
@cameronjonesweb Насправді, що він робить, це створити новий масив із таким самим вмістом, як ar1, додавати ar2 а потім поверніть новий масив. Просто залиште частину призначення (ar1 = ...) з цього рядка коду, і ви побачите, що оригінал  ar1 насправді не змінилося. Якщо ви хочете уникнути створення копії, вам знадобиться push. Не вірте, вірте документи: "Метод concat () повертає новий масив" Перше речення в документах для concat. - Stijn de Witt
@StijndeWitt Ви маєте рацію. Однак, інший спосіб переглянути це, однак, .push добре працює лише в додаванні окремих змінних / об'єктів, але, однак, спотворюватиметься при додаванні масивів, які ar2 вище в будь-якому випадку. Результат .push в сценарії буде = [ar1, [ar2]]. .concat вирішує цю проблему, але з жертвою швидкості та створеного нового масиву. Використовувати .push належним чином додаючи до масиву, спочатку спішіть міститься елемент і натисніть кожне. ar2.forEach(each => { ar1.push(each); }); - Ade


Деяке швидке тестування (кожен тест = 500k доданих елементів, а результати - середні показники для декількох тестів) показали наступне:

Firefox 3.6 (Mac):

  • Малі масиви: arr[arr.length] = b швидше (300 мс проти 800 мс)
  • Великі масиви: arr.push(b) швидше (500 мс проти 900 мс)

Safari 5.0 (Mac):

  • Малі масиви: arr[arr.length] = b швидше (90 мс проти 115 мс)
  • Великі масиви: arr[arr.length] = b швидше (160 мс проти 185 мс)

Google Chrome 6.0 (Mac):

  • Малі масиви: Немає суттєвої різниці (і Chrome швидкий! Тільки ~ 38мс !!)
  • Великі масиви: Немає суттєвої різниці (160 мс)

Мені подобається arr.push() синтаксис краще, але я думаю, що мені буде краще arr[arr.length] Версія, принаймні в сирій швидкості. Я хотів би бачити результати IE запустити, хоча.


Мої бенчмаркінгові цикли:

function arrpush_small() {
    var arr1 = [];
    for (a = 0; a < 100; a++)
    {
        arr1 = [];
        for (i = 0; i < 5000; i++)
        {
            arr1.push('elem' + i);
        }
    }
}

function arrlen_small() {
    var arr2 = [];
    for (b = 0; b < 100; b++)
    {
        arr2 = [];
        for (j = 0; j < 5000; j++)
        {
            arr2[arr2.length] = 'elem' + j;
        }
    }
}


function arrpush_large() {
    var arr1 = [];
    for (i = 0; i < 500000; i++)
    {
        arr1.push('elem' + i);
    }
}

function arrlen_large() {
    var arr2 = [];
    for (j = 0; j < 500000; j++)
    {
        arr2[arr2.length] = 'elem' + j;
    }
}

370



Питання полягає в тому, якщо .length є збереженим значенням або обчислюється при доступі, оскільки, якщо останнє правильне, можливо, використання простої змінної (наприклад, j) в якості значення індексу може бути ще швидше - yoel halb
+1 для статики, як ви робите цей еталон? - mko
@yozloy: jsperf.com твій друг :) - Jens Roland
Цей тип порівняльного аналізу є цікавим, але, як іронічно, не дуже допомагає робити програми швидше. Цикл рендеринга набагато набагато дорожче протягом будь-якого циклу. Крім того, ці внутрішні компоненти мови JS постійно оптимізуються розробниками веб-переглядача. Це причина для мене, а не цікава ця відповідь. Якщо ви хочете отримати швидкіші додатки, почніть тестовий показник і подивіться, що змінитися - 99 з 100 разів це не буде проблемою, як показує це тестування. Часто його бідний розробник JS / CSS - не внутрішній інтерфейс браузера, який робить це повільним. - LessQuesar
Я погоджуюсь з LessQuesar, дотримуючись принаймні можливостей. Не те, що мікро-оптимізація сама по собі погана, але він має рацію, що браузери завжди вдосконалюють свою швидкість двигуна. Випадок: на момент написання даної статті продуктивність для кожного браузера майже однакова для всіх перерахованих вище способів. Це означає багато суєти декілька років тому за такий невеликий прибуток, коли зараз ніякого прибутку немає. - Beejor


Я думаю, варто відзначити, що push можна викликати з кількома аргументами, які будуть додані до масиву в порядку. Наприклад:

var arr = ['first'];
arr.push('second', 'third');
console.log(arr); // ['first', 'second', 'third']

В результаті цього ви можете використовувати push.apply, щоб додати масив до іншого масиву так:

arr.push.apply(arr, ['forth', 'fifth']);
console.log(arr); // ['first', 'second', 'third', 'forth', 'fifth']

Анотований ES5 має більше інформації про те, що саме тиснути і застосовувати робити

2016 оновлення: з поширюватися, вам це не потрібно apply більше, як:

arr.push(...['fourth', 'fifth']);
console.log(arr) // ['first', 'second', 'third', 'fourth', 'fifth']

260



найкраща відповідь для додавання масиву елементів, не створюючи нового масиву. - Gabriel Littman
@GabrielLittman Спеціально тому, що додавши до масиву IMHO, слід змінити масив, а не створювати новий. - Juan Mendes
Мені подобається версія push.apply, швидше за все Array.prototype.push.apply() хоча - Michael
Іноді важливо зберегти посилання на масив - наприклад, в AngularJs, коли масив знаходиться на певному контролері, і деяка служба повинна оновлювати дані в масиві для відображення. Ось чому я вирішу це рішення. - see sharper


Ви можете використовувати push і apply функція для додавання двох масивів.

var array1 = [11, 32, 75];
var array2 = [99, 67, 34];

Array.prototype.push.apply(array1, array2);

Це додасться array2 до array1. Зараз array1 містить [11, 32, 75, 99, 67, 34]. Цей код набагато простіший, ніж написання for цикли для копіювання кожного елемента в масиві.


64



Це те, що я потребував, підтримую оригінальний довідник масиву - amit bakle


Використовуйте concat:

a = [1, 2, 3];
b = [3, 4, 5];
a = a.concat(b);

a тепер містить всі елементи, [1, 2, 3, 3, 4, 5].

Довідка: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/concat


35





Якщо arr є масивом, і val це значення, яке ви хочете додати:

arr.push(val);

Наприклад,

arr = ['a', 'b', 'c'];
arr.push('d');
console.log(arr);

буде зареєструватися:

['a', 'b', 'c', 'd']

34