Beberapa kaedah menggabungkan tatasusunan dalam JS dan perbandingan kelebihan dan kekurangan_Pengetahuan asas

Artikel ini tergolong dalam kemahiran asas JavaScript Kami akan mempelajari pelbagai kaedah biasa untuk menggabungkan/menggabungkan dua tatasusunan JS dan membandingkan kelebihan dan kekurangan pelbagai kaedah.

Mari kita lihat senario tertentu dahulu:

Salin kod Kod adalah seperti berikut:

var q = [5, 5, 1, 9, 9, 6, 4, 5, 8];
var b = [ "tali leher", "mao", "csdn", "ren", "fu", "fei" ];

Jelas sekali, hasil penyatuan mudah tatasusunan q dan b ialah:

Salin kod Kod adalah seperti berikut:

[
5, 5, 1, 9, 9, 6, 4, 5, 8,
"tali leher", "mao", "csdn", "ren", "fu", "fei"
]

kaedah concat(..)

Penggunaan yang paling biasa adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

var c = q.concat( b );

q; // [5,5,1,9,9,6,4,5,8]
b; // ["ikat","mao","csdn","ren","fu","fei"];

c; // [5,5,1,9,9,6,4,5,8,"ikat","mao","csdn","ren","fu",,"fei"]

Seperti yang anda lihat, c ialah tatasusunan serba baharu, mewakili gabungan dua tatasusunan q dan b, tetapi q dan b tidak berguna sekarang, bukan?

Jika tatasusunan q mempunyai 10,000 elemen, dan tatasusunan b juga mempunyai 10,000 elemen, maka tatasusunan c kini mempunyai 20,000 elemen, dan kaedah ini menggunakan memori dua kali ganda.

"Itu tiada masalah!", anda mungkin fikir hanya biarkan q dan b kosong, dan kemudian mereka akan menjadi sampah, bukan?

Salin kod Kod adalah seperti berikut:

q = b = null; // `q` dan `b` kini sampah dikutip

Um? Jika tatasusunan kecil, maka tidak ada masalah Tetapi untuk tatasusunan yang besar, atau apabila pemprosesan berulang diperlukan beberapa kali, memori adalah terhad, dan ia juga perlu dioptimumkan

Sisipan gelung

OK, mari cuba tambah kandungan satu tatasusunan kepada tatasusunan yang lain, menggunakan kaedah Array#push():

Salin kod Kod adalah seperti berikut:

// Masukkan tatasusunan `b` ke dalam `q`

untuk (var i=0; i < b.panjang; i ) {
​ q.tolak( b[i] );
}

q; // [5,5,1,9,9,6,4,5,8,"ikat","mao","csdn","ren","fu",,"fei"]

b = batal;

Kini, q menyimpan kandungan dua tatasusunan asal (q b).

Nampaknya pengoptimuman memori telah dilakukan dengan baik.

Tetapi bagaimana jika tatasusunan q kecil dan b besar demi ingatan dan kelajuan, anda ingin memasukkan q yang lebih kecil di hadapan b Tidak ada masalah, hanya gunakan kaedah unshift() dan bukannya push(. ) Itu sahaja, dan kitaran yang sepadan perlu dilalui dari besar ke kecil:

Salin kod Kod adalah seperti berikut:

// `q` ke dalam `b`:

untuk (var i=q.length-1; i >= 0; i--) {
b.unshift( q[i] );
}

b; // [5,5,1,9,9,6,4,5,8,"ikat","mao","csdn","ren","fu","fei"]

q = batal;

Petua Praktikal

Sedihnya, untuk gelung membosankan dan sukar untuk diselenggara. Bolehkah kita melakukan yang lebih baik?

Jom cuba Array#reduce dulu:

Salin kod Kod adalah seperti berikut:

// `b` ke `q`:

q = b.reduce( function(coll,item){
coll.push(item);
Pulangan coll;
}, q );

q; // [5,5,1,9,9,6,4,5,8,"ikat","mao","csdn","ren","fu",,"fei"]

// atau `q` ke dalam `b`:

b = q.reduceRight( fungsi(coll,item){

coll.unshift(item);
Pulangan coll;
}, b );

b; // [5,5,1,9,9,6,4,5,8,"ikat","mao","csdn","ren","fu","fei"]

Array#reduce() dan Array#reduceRight() adalah sangat mewah, tetapi agak menyusahkan, dan kebanyakan orang tidak dapat mengingatinya The => anak panah-fungsi dalam spesifikasi JS 6 boleh mengurangkan jumlah kod. , tetapi ia memerlukan panggilan fungsi untuk setiap elemen tatasusunan, yang juga merupakan kaedah yang sangat lemah Jadi bagaimana dengan kod di bawah?

Salin kod Kod adalah seperti berikut:

// `b` ke `q`:
q.push.apply( q, b );
q; // [5,5,1,9,9,6,4,5,8,"ikat","mao","csdn","ren","fu",,"fei"]

// atau `q` ke dalam `b`:

b.unshift.apply( b, q );

b; // [5,5,1,9,9,6,4,5,8,"ikat","mao","csdn","ren","fu","fei"]

BIG lebih tinggi, bukan!? Terutamanya kaedah unshift() tidak perlu mempertimbangkan urutan terbalik seperti sebelumnya. ..b ) atau b.unshift( ...a )

Walau bagaimanapun, sebenarnya kaedah ini masih terlalu optimistik dalam kedua-dua kes, sama ada a atau b diluluskan untuk memohon() sebagai parameter kedua (parameter pertama adalah dalaman apabila memanggil Fungsi dalam mod gunakan Jadi ini (iaitu konteks, konteks, skop), atau gunakan... operator pengembangan Sebenarnya, tatasusunan akan dipecahkan kepada argumen fungsi.

Masalah utama yang pertama ialah ia mengambil dua kali ganda memori (sementara, sudah tentu!) kerana tatasusunan perlu disalin ke timbunan fungsi Selain itu, enjin JS yang berbeza mempunyai algoritma pelaksanaan yang berbeza, yang mungkin mengehadkan bilangan parameter yang boleh dihantar ke fungsi.

Jika satu juta elemen ditambahkan pada tatasusunan, ia pasti akan melebihi saiz yang dibenarkan oleh timbunan fungsi, tanpa mengira panggilan push() atau unshift() Kaedah ini hanya tersedia apabila terdapat beribu-ribu elemen, jadi ia mestilah terhad Ia tidak boleh melebihi julat tertentu.

Nota: Anda juga boleh mencuba splice(), dan anda pasti akan mendapati bahawa ia mempunyai sekatan yang sama seperti push(..)/unshift(..).

Satu pilihan adalah untuk terus menggunakan kaedah ini, tetapi dalam kelompok:

Salin kod Kod adalah seperti berikut:

function combineInto(q,b) {
var len = q.panjang;
untuk (var i=0; i < len; i=i 5000) {
// Proses 5000 item pada satu masa
b.unshift.apply( b, q.slice( i, i 5000 ) );
}
}

Tunggu, kami menjejaskan kebolehbacaan kod kami (dan juga prestasi! Mari kita tamatkan perjalanan ini sebelum kita berputus asa.

).

Ringkasan

Array#concat() ialah kaedah yang dicuba dan diuji untuk menggabungkan dua (atau lebih) tatasusunan Tetapi ia mencipta tatasusunan baharu dan bukannya mengubah suai yang sedia ada.

Terdapat banyak kaedah alternatif, tetapi semuanya mempunyai kelebihan dan kekurangan yang berbeza, dan anda perlu memilih mengikut situasi sebenar.

Terdapat pelbagai kelebihan/kelemahan yang disenaraikan di atas, mungkin yang terbaik (termasuk yang tidak disenaraikan) ialah reduce(..) dan reduceRight(..)

Apa sahaja yang anda pilih, fikirkan secara kritis tentang strategi penggabungan tatasusunan anda dan jangan ambil mudah