Pertanyaan Bagaimana menambahkan sesuatu ke array?


Bagaimana cara menambahkan objek (seperti string atau angka) ke array dalam JavaScript?


2872


asal


Jawaban:


Menggunakan push() berfungsi untuk menambahkan ke array:

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

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

console.log(arr);

Akan dicetak

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

Anda dapat menggunakan push() berfungsi untuk menambahkan lebih dari satu nilai ke array dalam satu panggilan:

// 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]);
}

Akan dicetak

Hi
Hello
Bonjour
Hola 
Salut
Hey

Memperbarui

Jika Anda ingin menambahkan item dari satu array ke array lain, Anda dapat menggunakan firstArray.concat(secondArray):

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

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

console.log(arr);

Akan dicetak

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

3378



Jika Anda hanya menambahkan satu variabel, lalu push() bekerja dengan baik. Jika Anda perlu menambahkan array lain, gunakan concat():

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

var ar3 = ar1.concat(ar2);

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

Akan dimuntahkan:

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

Kontra tidak mempengaruhi ar1 dan ar2 kecuali ditugaskan ulang, misalnya:

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

Akan ditampilkan:

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

Banyak info bagus sini


954



Beberapa pembandingan cepat (setiap pengujian = 500k elemen yang ditambahkan dan hasilnya adalah rata-rata dari beberapa proses) menunjukkan hal berikut:

Firefox 3.6 (Mac):

  • Array kecil: arr[arr.length] = b lebih cepat (300ms vs. 800ms)
  • Array besar: arr.push(b) lebih cepat (500ms vs. 900ms)

Safari 5.0 (Mac):

  • Array kecil: arr[arr.length] = b lebih cepat (90ms vs. 115ms)
  • Array besar: arr[arr.length] = b lebih cepat (160ms vs 185ms)

Google Chrome 6.0 (Mac):

  • Array kecil: Tidak ada perbedaan yang signifikan (dan Chrome CEPAT! Hanya ~ 38ms !!)
  • Array besar: Tidak ada perbedaan yang signifikan (160 ms)

saya suka arr.push() sintaks yang lebih baik, tapi saya pikir saya akan lebih baik dengan arr[arr.length] Versi, setidaknya dalam kecepatan mentah. Saya ingin sekali melihat hasil dari IE dijalankan.


Simpul pembandingan saya:

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;
    }
}

369



Saya pikir perlu disebutkan bahwa push dapat dipanggil dengan banyak argumen, yang akan ditambahkan ke array secara berurutan. Sebagai contoh:

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

Sebagai akibatnya, Anda dapat menggunakan push.apply untuk menambahkan array ke array lain seperti:

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

ES5 beranotasi memiliki info lebih lanjut tentang apa Dorong dan menerapkan melakukan.

Pembaruan 2016: dengan penyebaran, Anda tidak membutuhkan itu apply lagi, seperti:

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

259



Kamu dapat memakai push dan apply berfungsi untuk menambahkan dua larik.

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

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

Itu akan ditambahkan array2 untuk array1. Sekarang array1 mengandung [11, 32, 75, 99, 67, 34]. Kode ini jauh lebih sederhana daripada menulis for loop untuk menyalin setiap item dalam larik.


64



Menggunakan concat:

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

a sekarang mengandung semua elemen, [1, 2, 3, 3, 4, 5].

Referensi: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/concat


35



Jika arr adalah larik, dan val adalah nilai yang ingin Anda tambahkan gunakan:

arr.push(val);

Misalnya.

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

akan mencatat:

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

34



Dengan ES6 baru operator menyebar, menggabungkan dua larik menggunakan push menjadi lebih mudah:

var arr = [1, 2, 3, 4, 5];
var arr2 = [6, 7, 8, 9, 10];
arr.push(...arr2);
console.log(arr); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

Ini menambahkan isi arr2 sampai akhir arr.

Contoh Babel REPL


33



Jika Anda ingin menambahkan dua larik -

var a = ['a', 'b'];
var b = ['c', 'd'];

maka Anda bisa menggunakan:

var c = a.concat(b);

Dan jika Anda ingin menambahkan catatan g ke array (var a=[]) maka Anda bisa menggunakan:

a.push('g');

27



Javascript dengan ECMAScript 5 standar yang didukung oleh sebagian besar browser sekarang, dapat Anda gunakan apply() untuk menambahkan array1 untuk array2.

var array1 = [3, 4, 5];
var array2 = [1, 2];

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

console.log(array2); // [1, 2, 3, 4, 5]

Javascript dengan ECMAScript 6 standar yang didukung oleh Chrome dan FF dan IE Edge, Anda dapat menggunakan spreadoperator:

"use strict";
let array1 = [3, 4, 5];
let array2 = [1, 2];

array2.push(...array1);

console.log(array2); // [1, 2, 3, 4, 5]

Itu spread operator akan menggantikan array2.push(...array1); dengan array2.push(3, 4, 5); ketika browser memikirkan logika.

Poin bonus

Jika Anda ingin membuatnya lain variabel untuk menyimpan semua item dari kedua larik, Anda dapat melakukan ini:

ES5  var combinedArray = array1.concat(array2);

ES6  const combinedArray = [...array1, ...array2]

Operator penyebaran (...) adalah untuk menyebar semua item dari koleksi.


24