Soru Diziye bir şey eklemek nasıl?


JavaScript'teki bir diziye bir nesneyi (örneğin, bir dize veya sayı gibi) nasıl eklerim?


2880


Menşei




Cevaplar:


Kullan push() bir diziye eklenecek işlev:

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

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

console.log(arr);

Yazdıracak

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

Kullanabilirsiniz push() Tek bir çağrıda bir diziye birden fazla değer eklemek için işlev:

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

Yazdıracak

Hi
Hello
Bonjour
Hola 
Salut
Hey

Güncelleştirme

Bir dizinin öğelerini başka bir diziye eklemek isterseniz, firstArray.concat(secondArray):

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

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

console.log(arr);

Yazdıracak

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

3386



.Push öğesinin dönüş değeri, dizi (veya .concat gibi yeni bir tane) değil, dizinin yeni uzunluğunu temsil eden bir tam sayı olduğunu unutmayın. - Jay
@RST: kullanmayın for hiç .forEach). - Robert Siemer
Orijinal kodun iyi olduğunu söyleyebilirim. Erişime erişimi optimize etmek için herhangi bir şeye ihtiyaç yoktur. lengthözelliği. Tercüman kendisi için harika bir iş çıkarır ve Gerçek Dünya'da onu optimize edip etmemeniz fark etmez. Dizininiz o kadar büyük hale gelirse .length Aslında yardımcı olur, büyük olasılıkla bir dizi doğru veri yapısı değildir. kullanma forEach avantajları vardır, ancak her iterasyon için işlev çağrısı bir maliyete neden olduğu ve hiçbir şey kaydetmediği için, performansın artmış olmasının bir onlardan biri olması son derece şüphelidir. - Stijn de Witt
@RobertSiemer length Bir dizinin özelliği, her arama yaptığınızda hesaplanmaz; array Yalnızca diziyi değiştirdiğinizde güncellenen nesne. Yani aslında dahil hiçbir performans maliyeti yoktur arr.length içinde for şart. - mikeyq6
@Mojimi Bir başlangıç ​​olarak, bu gibi kenar durumlarda performans soruları ile ilgili herhangi bir tavsiyeyi göz ardı edin. Daha etkileyici sözdizimini kullanın. Zaman içinde Javascript çalışma zamanları daha fazla optimizasyon ekler - satır içi forEach Geri çağırma işlevleri (bazıları muhtemelen bunu zaten yapıyor) ve işlev, çalışma zamanı tarafından yorumlanmak yerine derlenecek kadar sıklıkla çağrılırsa oluşturulan makine kodunda hiçbir fark olmayacaktır. Aslında, montajcı olmayan herhangi bir dil için de aynı tavsiye geçerlidir. - Mörre


Yalnızca tek bir değişken ekliyorsanız push() gayet iyi çalışıyor. Başka bir dizi eklemeniz gerekirse concat():

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

var ar3 = ar1.concat(ar2);

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

Tükürecek:

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

Konser etkilemez ar1 ve ar2 örneğin yeniden atamadıkça:

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

Gösterecek:

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

Harika bir sürü bilgi İşte


954



Sadece insanların var ar3 = ar1.concat (ar2) 'yi yakaladığından emin olmak; Bölüm. ar1.concat (ar2), değerleri ar1'e kaydetmez. Bunu ar3'e veya ar1'e geri atayarak yakalamanız gerekir, örneğin: ar1 = ar1.concat (ar2); - vbullinger
Bunun yanlış cevap olduğunu söyleyebilirim. Soru How do I append to an array in JavaScript?, fakat concat aslında yaratır bir yeni dizi. Bu önemli bir fark! Bunun yerine, Omnimike tarafından verilen cevabın aslında en iyisi olduğunu söyleyebilirim: Push.apply Bütün bir diziyi, yeni bir tane oluşturmadan mevcut bir diziye itmek. - Stijn de Witt
@StijndeWitt hala önceki yorumda belirtildiği gibi, yeni bir dizi oluşturmadan ekleyebilirsiniz ar1 = ar1.concat(ar2); ekleyecek ar1 - cameronjonesweb
@cameronjonesweb Aslında, aynı içeriğe sahip yeni bir dizi oluşturuyor. ar1, ekle ar2 ve sonra yeni diziyi döndür. Sadece ödev bölümünü terk et (ar1 = ...) bu kod satırından göreceksiniz ki orijinal  ar1 aslında değişmedi. Bir kopyasını yapmak istemiyorsanız, ihtiyacınız olacak push. İnan bana inan dokümanlar: "Concat () yöntemi yeni bir dizi döndürüyor" Dokümanlar için ilk cümle concat. - Stijn de Witt
@StijndeWitt Haklısınız. Ancak, buna bakmak için farklı bir yol, .push sadece tek değişkenler / nesneler ekleyerek iyi çalışır, ancak Arrays eklenmesi söz konusu olduğunda ar2 her neyse. Sonucu .push senaryoda olacak = [ar1, [ar2]]. .concat bu sorunu çözüyor, ancak hızın kurbanı ve yeni bir dizi yaratıldı. Kullanmak .push dizide düzgün bir şekilde eklenir, önce bulunan öğeyi döngüye alır ve her birini itin. ar2.forEach(each => { ar1.push(each); }); - Ade


Bazı hızlı kıyaslama (her test = 500k eklenmiş elemanlar ve sonuçlar birden fazla çalışmanın ortalamalarıdır) aşağıdakileri gösterdi:

Firefox 3.6 (Mac):

  • Küçük diziler: arr[arr.length] = b daha hızlı (800ms vs 800ms)
  • Geniş diziler: arr.push(b) daha hızlı (500ms vs 900ms)

Safari 5.0 (Mac):

  • Küçük diziler: arr[arr.length] = b daha hızlı (90ms vs 115ms)
  • Geniş diziler: arr[arr.length] = b daha hızlı (160ms vs 185ms)

Google Chrome 6.0 (Mac):

  • Küçük diziler: Önemli bir fark yok (ve Chrome HIZLI! Sadece ~ 38ms!)
  • Geniş diziler: Önemli bir fark yok (160ms)

Beğendim arr.push() sözdizimi daha iyi, ama bence daha iyi olacağım arr[arr.length] Sürüm, en azından ham hızda. Yine de bir IE çalışmasının sonuçlarını görmek isterim.


Kıyaslama döngülerim:

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



Soru şudur: eğer .length depolanmış bir değer mi yoksa erişildiğinde hesaplanır, çünkü eğer ikincisi doğruysa o zaman indeks değeri daha hızlı olabileceği için basit bir değişken (j gibi) kullanmak olabilir. - yoel halb
Statik için +1, Bu kıyaslamayı nasıl yapıyorsunuz? - mko
@yozloy: jsperf.com senin arkadaşın :) - Jens Roland
Bu tür bir kıyaslama ilginçtir, ancak uygulamaların daha hızlı yapılmasında ironik olarak çok yararlı değildir. İşleme döngüsü, herhangi bir döngü sırasında çok daha pahalı. Buna ek olarak, JS dilinin iç yapısı sürekli olarak tarayıcı geliştiricileri tarafından optimize edilmektedir. Bu benim düşüşümün sebebi, bu cevabın ilginçliği değil. Daha hızlı uygulamalar, kıyas ölçütü ve neyin değişeceğini görmek isterseniz, 100 kez 99'u bu test gösterileri gibi bir sorun olmayacaktır. Çoğu zaman zayıf geliştirici JS / CSS - tarayıcıyı yavaşlatır. - LessQuesar
Mümkün olduğunda, yapılara yapışarak LessQuesar'a katılıyorum. Mikro optimizasyonun kendisi kendi başına kötü değil, ancak tarayıcıların her zaman motor hızlarını arttırdığı doğru. Vaka noktası: bu yazıdan yola çıkarak, tarayıcı başına performans, yukarıda listelenen tüm teknikler için neredeyse aynıdır. Birkaç yıl önce, böyle bir kazanç elde etmek için, bu kadar küçük bir kazanç için çok fazla anlam ifade ediyor. - Beejor


Sırayla diziye eklenecek çoklu argümanlar ile itmenin çağrılabileceğinden bahsetmeye değer. Örneğin:

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

Bunun sonucunda, başka bir diziye bir dizi eklemek için push.apply özelliğini kullanabilirsiniz:

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

Açıklamalı ES5 tam olarak ne hakkında daha fazla bilgi var it ve uygulamak yap.

2016 güncellemesi: ile YAYILMIŞbuna ihtiyacın yok apply artık, gibi:

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

260



Yeni bir dizi oluştururken, bir dizi öğe eklemek için en iyi cevap. - Gabriel Littman
@GabrielLittman Özel olarak bir diziye eklenmesi nedeniyle IMHO, diziyi değiştirmeli, yeni bir tane oluşturmamalıdır. - Juan Mendes
Push.apply sürümünü beğendim, kullanmak isterim Array.prototype.push.apply() gerçi. - Michael
Bazen bir dizinin referansını korumak önemlidir - örneğin bir dizi bir denetleyicide kapsama alanı olduğunda ve bazı servislerin görüntü için dizideki verileri güncellemesi gerektiğinde AngularJs içinde. Bu yüzden bu çözümü yok ediyorum. - see sharper


Kullanabilirsiniz push ve apply iki diziyi eklemek için işlev.

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

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

Ekleyecek array2 için array1. şimdi array1 içeren [11, 32, 75, 99, 67, 34]. Bu kod yazmadan çok daha basit for dizideki her bir öğeyi kopyalamak için döngüler.


64



Gerekli olan bu, orijinal dizi referansını sürdürmek - amit bakle


kullanım concat:

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

a şimdi tüm unsurları içerir, [1, 2, 3, 3, 4, 5].

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


35





Eğer arr bir dizi ve val kullanım eklemek istediğiniz değerdir:

arr.push(val);

Örneğin.

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

giriş yapacak:

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

34





Yeni ES6 ile yayılmış operatörkullanarak iki dizinin birleştirilmesi push daha da kolaylaşır:

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

Bu içeriği ekler arr2 sonuna arr.

Babel REPL Örneği


33





Eğer iki diziyi eklemek istiyorsan -

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

o zaman kullanabilirsiniz:

var c = a.concat(b);

Ve kayıt eklemek istiyorsanız g sıralamak (var a=[]) o zaman kullanabilirsiniz:

a.push('g');

27