Selama proses pengembangan skrip, string besar sering kali digabungkan dan disambung untuk menghasilkan keluaran menurut aturan tertentu. Misalnya, saat menulis kontrol skrip, keluaran tag HTML yang mengontrol tampilan seluruh kontrol, atau saat menganalisis dan membuat tag HTML secara dinamis setelah mendapatkan nilai pengembalian sisi server di AJAX, tetapi saya tidak akan membahas penerapan spesifik dari penyambungan string di sini. Saya hanya ingin membahas efisiensi penyambungan di sini.
Saat kami menulis penyambungan string, kami selalu menggunakan operator "+=", s += String; Ini adalah metode penulisan yang paling familiar. Saya tidak tahu apakah Anda memperhatikan bahwa kapasitas string gabungan adalah Ketika nomornya puluhan bahkan ratusan K, eksekusi script sangat lambat dan penggunaan CPU sangat tinggi, contoh:
var str = "01234567891123456789212345678931234567894123456789";
str+= "51234567896123456789712345678981234567899123456789n";
var hasil = "";
for(var i=0; i<2000; i++) result += str;
Hanya dalam satu langkah, string hasil adalah 200K, dibutuhkan 1,1 detik (ini terkait dengan konfigurasi komputer), dan nilai puncak CPU adalah 100 %. (Untuk melihat efeknya secara lebih intuitif, saya membuat beberapa putaran lagi). Bisa dibayangkan bahwa langkah operasi seperti itu menghabiskan lebih dari satu detik waktu saya. Ditambah dengan konsumsi waktu kode lain, waktu eksekusi seluruh blok skrip menjadi tak tertahankan. Apakah ada solusi pengoptimalan? Apakah ada cara lain? Jawabannya tentu saja iya, kalau tidak maka tidak masuk akal jika saya menulis artikel ini.
Cara yang lebih cepat adalah dengan menggunakan array. Saat menyambung dalam sebuah loop, alih-alih menyambungkannya menjadi string, string tersebut dimasukkan ke dalam array, dan terakhir array.join("") digunakan untuk mendapatkan string hasil. Contoh kode :
var str = "01234567891123456789212345678931234567894123456789";
str+= "51234567896123456789712345678981234567899123456789n";
var hasil = "", a = Array baru();
untuk(var i=0; i<2000; i++) a[i] = str;
result = a.join(""); a = null;
Anda dapat menguji waktu yang diperlukan untuk menggabungkan string dengan ukuran yang sama. Hasil yang saya uji di sini adalah: <15 milidetik. yang berarti bahwa untuk merakit string 200K, konsumsi waktu kedua mode hampir dua kali lipat. maksudnya itu apa? Artinya yang terakhir sudah selesai bekerja dan kembali dari makan siang, sedangkan yang pertama masih bekerja keras. Saya menulis halaman pengujian. Anda dapat menyalin kode berikut dan menyimpannya sebagai file HTM dan membukanya di halaman web untuk menguji perbedaan efisiensi antara keduanya , dan yang terakhir Atau dapat dilakukan dalam 0,07 detik (loop 10.000 kali).
<tubuh>
Jumlah rangkaian string<input id="totle" value="1000" size="5" maxlength="5">
<input type="button" value="Metode penyambungan string" onclick="method1()">
<input type="button" value="Metode penggabungan penugasan array" onclick="method2()"><br>
<div id="metode1"> </div>
<div id="metode2"> </div>
<textarea id="show" style="width: 100%; tinggi: 400"></textarea>
<BAHASA SKRIP="JavaScript">
<!--
//Panjang string yang disambung ini adalah 100 byte penulis: meizz
var str = "01234567891123456789212345678931234567894123456789";
str+= "51234567896123456789712345678981234567899123456789n";
//Metode 1
metode fungsi1()
{
var hasil = "";
var totle = parseInt(document.getElementById("totle").value);
var n = Tanggal baru().getTime();
untuk(var i=0; i<totle; i++)
{
hasil += str;
}
document.getElementById("show").nilai = hasil;
var s = "Metode penyambungan string: panjang string besar setelah penyambungan"+ result.length +"bytes,"+
"Penyambungan membutuhkan waktu" + (new Date().getTime()-n) + "Milidetik!";
document.getElementById("method1").innerHTML = s;
}
//Metode 2
metode fungsi2()
{
var hasil = "";
var totle = parseInt(document.getElementById("totle").value);
var n = Tanggal baru().getTime();
var a = Array baru();
untuk(var i=0; i<totle; i++)
{
a[i] = str;
}
hasil = a.join(""); a=null;
document.getElementById("show").nilai = hasil;
var s = "Metode penggabungan penugasan array: panjang string besar setelah penyambungan"+ result.length +"bytes,"+
"Penyambungan membutuhkan waktu" + (new Date().getTime()-n) + "Milidetik!";
document.getElementById("method2").innerHTML = s;
}
//-->
</SCRIPT>
Terakhir, izinkan saya menyampaikan beberapa patah kata. Apakah gabungan array akan digunakan untuk penyambungan string di masa mendatang? Ini tergantung pada kebutuhan Anda yang sebenarnya. Untuk kombinasi biasa beberapa byte atau level K, tidak perlu menggunakan metode array, karena membuka variabel array juga mahal. Jika ada lebih dari beberapa kombinasi string K, efisiensi arraynya tinggi.
--------------------------------------------------- ----------
YAITU 6.0:
Metode penyambungan string: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 22.089 milidetik!
Metode penggabungan penugasan array: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 218 milidetik!
Firefox 1.0:
Metode penyambungan string: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 1.044 milidetik!
Metode penggabungan penugasan array: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 1.044 milidetik!
Mozilla 1.7:
Metode penyambungan string: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 1.045 milidetik!
Metode penggabungan penugasan array: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 1.044 milidetik!
Netscape 7.0:
Metode penyambungan string: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 10.273 milidetik!
Metode penggabungan penugasan array: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 1.138 milidetik!
Operasi 7.54:
Metode penyambungan string: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 6.968 milidetik!
Metode penggabungan penugasan array: String besar yang disambung memiliki panjang 1.010.000 byte, dan penyambungan membutuhkan waktu 6922 milidetik!
Hasil pengujian perulangan 10.000 kali menunjukkan bahwa efisiensi dapat ditingkatkan secara signifikan di IE dan Netscape, sedangkan konsumsi waktu kedua metode di Firefox Mozilla Opera pada dasarnya serupa penyambungan senar tradisional.