ในระหว่างการพัฒนาสคริปต์สตริงขนาดใหญ่มักจะรวมกันและเชื่อมต่อเป็นสตริงขนาดใหญ่สำหรับเอาต์พุตตามกฎบางอย่าง ตัวอย่างเช่นเมื่อเขียนการควบคุมสคริปต์ผลลัพธ์ของแท็ก HTML ที่ควบคุมลักษณะที่ปรากฏของการควบคุมทั้งหมด ตัวอย่างเช่นเมื่อวิเคราะห์แท็ก HTML แบบไดนามิกหลังจากได้รับค่าด้านหลังฝั่งเซิร์ฟเวอร์ใน AJAX ฉันจะไม่พูดถึงแอปพลิเคชันเฉพาะของสตริงการประกบที่นี่ ฉันแค่ต้องการพูดคุยถึงประสิทธิภาพของการประกบที่นี่
เมื่อเราเขียนโค้ดเราจะใช้ตัวดำเนินการ " +=", s += สตริง; นี่เป็นวิธีที่คุ้นเคยที่สุดในการเขียน ฉันสงสัยว่าคุณสังเกตเห็นหรือไม่ เมื่อความจุสตริงรวมเป็นสิบ k หรือแม้กระทั่งหลายร้อย k สคริปต์ช้ามากในการดำเนินการและอัตราการใช้งาน CPU สูงมากเช่น:
การคัดลอกรหัสมีดังนี้:
var str = "01234567891123456789212345678931234567894123456789";
str+= "51234567896123456789712345678981234567899123456789/n";
var result = "";
สำหรับ (var i = 0; i <2000; i ++) ผลลัพธ์+= str;
ในขั้นตอนเดียวสตริงผลลัพธ์ที่สร้างขึ้นคือ 200K ซึ่งใช้เวลา 1.1 วินาที (ซึ่งเกี่ยวข้องกับการกำหนดค่าคอมพิวเตอร์) และยอด CPU สูงสุด 100% (ฉันมีลูปมากขึ้นเพื่อดูเอฟเฟกต์มากขึ้นอย่างสังหรณ์ใจ) มันสามารถจินตนาการได้ว่าการดำเนินการเพียงขั้นตอนเดียวทำให้ฉันมากกว่าหนึ่งวินาทีและควบคู่ไปกับเวลาที่ใช้ในรหัสอื่นเวลาการดำเนินการของบล็อกสคริปต์ทั้งหมดจะทนไม่ได้ มีวิธีแก้ปัญหาการเพิ่มประสิทธิภาพหรือไม่? มีวิธีอื่นอีกไหม? แน่นอนว่ามีคำตอบมิฉะนั้นฉันจะไร้สาระที่จะเขียนบทความนี้
วิธีที่เร็วกว่าคือการใช้อาร์เรย์ เมื่อกระจายลูปมันจะไม่แยกมันลงในสตริงที่แน่นอน แต่จะใส่สตริงลงในอาร์เรย์และในที่สุดก็ใช้ array.join ("") เพื่อรับสตริงผลลัพธ์ ตัวอย่างรหัส:
การคัดลอกรหัสมีดังนี้:
var str = "01234567891123456789212345678931234567894123456789";
str+= "51234567896123456789712345678981234567899123456789/n";
var result = "", a = array ใหม่ ();
สำหรับ (var i = 0; i <2000; i ++) a [i] = str;
ผลลัพธ์ = a.join (""); a = null;
คุณสามารถทดสอบและทดสอบเวลาที่ใช้ในการรวมสตริงที่มีขนาดเท่ากัน ผลลัพธ์ที่ฉันทดสอบที่นี่คือ: <15 มิลลิวินาที โปรดทราบว่าหน่วยของมันคือมิลลิวินาที กล่าวคือการรวมสตริง 200k ดังกล่าวการใช้เวลาของสองโหมดนั้นมีขนาดประมาณสองคำสั่ง นั่นหมายความว่าอย่างไร? ซึ่งหมายความว่าหลังทำงานเสร็จแล้วและกลับมาจากมื้อกลางวันในขณะที่อดีตยังคงทำงานเป็นคูลี่ ฉันจะเขียนหน้าทดสอบ คุณสามารถคัดลอกรหัสต่อไปนี้และบันทึกเป็นไฟล์ HTM และเปิดบนหน้าเว็บเพื่อทดสอบความแตกต่างของประสิทธิภาพระหว่างทั้งสอง อย่างไรก็ตามฉันกำลังทดสอบอดีตที่ใช้เวลาครึ่งนาทีในการเสร็จสิ้นและหลังที่ใช้เวลา 0.07 วินาที (10,000 ลูป)
การคัดลอกรหัสมีดังนี้:
<body>
จำนวนของสตริง splicing times <input id = "totle" value = "1000" size = "5" maxLength = "5">
<อินพุต type = "button" value = "วิธีการประกบสตริง" onclick = "method1 ()">>
<อินพุต type = "button" value = "การกำหนดอาร์เรย์การเข้าร่วมวิธีการ" onclick = "method2 ()"> <br>
<div id = "method1"> </div>
<div id = "method2"> </div>
<textarea id = "show"> </textarea>
<ภาษาสคริปต์ = "JavaScript">
-
// ความยาวของสตริงนี้ถูกประกบกันคือ 100 ไบต์ผู้แต่ง: meizz
var str = "01234567891123456789212345678931234567894123456789";
str+= "51234567896123456789712345678981234567899123456789/n";
// วิธี 1
ฟังก์ชั่นวิธีการ 1 ()
-
var result = "";
var totle = parseInt (document.getElementById ("totle"). ค่า);
var n = วันที่ใหม่ (). getTime ();
สำหรับ (var i = 0; i <totle; i ++)
-
ผลลัพธ์ += str;
-
document.getElementById ("แสดง"). value = ผลลัพธ์;
var s = "วิธีการประกบสตริง: สตริงขนาดใหญ่ spliced ยาว"+ result.length+ "byte,"+
"เวลาแยก" + (วันที่ใหม่ (). getTime ()-n) + "มิลลิวินาที!";
document.getElementById ("method1"). innerhtml = s;
-
// วิธี 2
ฟังก์ชั่นวิธีการ 2 ()
-
var result = "";
var totle = parseInt (document.getElementById ("totle"). ค่า);
var n = วันที่ใหม่ (). getTime ();
var a = new Array ();
สำหรับ (var i = 0; i <totle; i ++)
-
a [i] = str;
-
ผลลัพธ์ = a.join (""); a = null;
document.getElementById ("แสดง"). value = ผลลัพธ์;
var s = "การกำหนดอาร์เรย์วิธีการเข้าร่วม: สตริงขนาดใหญ่ spliced ยาว" + result.length + "byte," +
"เวลาแยก" + (วันที่ใหม่ (). getTime ()-n) + "มิลลิวินาที!";
document.getElementById ("method2"). innerhtml = s;
-
-
</script>
ในที่สุดฉันจะพูดอีกสองสามคำ การประกบสตริงทั้งหมดจะใช้อาเรย์เข้าร่วมในอนาคตหรือไม่? ขึ้นอยู่กับความต้องการที่แท้จริงของคุณ ไม่จำเป็นต้องใช้วิธีการอาร์เรย์สำหรับการรวมกันทั่วไปของหลายไบต์หรือ K-level เนื่องจากตัวแปรเปิดอาเรย์ หากมีการรวมกันของสตริง K มากกว่าสองสามชุดก็หมายความว่าอาร์เรย์มีประสิทธิภาพ
เช่น 6.0:
วิธีการประกบสตริง: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และการประกบใช้เวลา 22,089 มิลลิวินาที!
วิธีการเข้าร่วมการกำหนดอาร์เรย์: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และใช้เวลา 218 มิลลิวินาทีในการประกบกัน!
Firefox 1.0:
วิธีการประกบสตริง: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และการประกบใช้เวลา 1044 มิลลิวินาที!
วิธีการเข้าร่วมการกำหนดอาร์เรย์: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และการประกบใช้เวลา 1,044 มิลลิวินาที!
Mozilla 1.7:
วิธีการประกบสตริง: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และการประกบใช้เวลา 1,045 มิลลิวินาที!
วิธีการเข้าร่วมการกำหนดอาร์เรย์: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และการประกบใช้เวลา 1,044 มิลลิวินาที!
NetScape 7.0:
วิธีการประกบสตริง: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และการประกบใช้เวลา 10,273 มิลลิวินาที!
วิธีการเข้าร่วมการกำหนดอาร์เรย์: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และใช้เวลา 1138 มิลลิวินาทีในการประกบกัน!
โอเปร่า 7.54:
วิธีการประกบสตริง: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และการประกบใช้เวลา 6968 มิลลิวินาที!
วิธีการเข้าร่วมการกำหนดอาร์เรย์: สตริงขนาดใหญ่ที่มีความยาว 1010,000 ไบต์และการประกบใช้เวลา 6922 มิลลิวินาที!
ผลการทดสอบ 10,000 รอบแสดงให้เห็นว่าประสิทธิภาพสามารถปรับปรุงได้อย่างมากใน IE และ Netscape ในขณะที่ Firefox Mozilla Opera ทั้งสองวิธีใช้เวลาเกือบจะในเวลาเดียวกัน ข้อมูลเหล่านี้เพียงพอที่จะพิจารณาว่าวิธีการเข้าร่วมอาร์เรย์ดีกว่าการประกบสตริงแบบดั้งเดิม