JavaScript มีฟังก์ชั่นที่ทรงพลังและเป็นที่นิยมสองฟังก์ชั่นในหมู่นักพัฒนา: แยกและเข้าร่วม ฟังก์ชั่นทั้งสองนี้สามารถแลกเปลี่ยนทั้งประเภทสตริงและอาร์เรย์ได้นั่นคืออาร์เรย์สามารถถูกทำให้เป็นลำดับในสตริงและในทางกลับกัน เราสามารถเล่นฟังก์ชั่นทั้งสองนี้ได้อย่างเต็มที่ มาสำรวจแอปพลิเคชันที่น่าสนใจที่นี่ ก่อนอื่นมาแนะนำฟังก์ชั่นทั้งสองนี้:
string.prototype.split (ตัวคั่น, ขีด จำกัด )
ตัวคั่นแบ่งสตริงเป็นอาร์เรย์และขีด จำกัด พารามิเตอร์เสริมกำหนดความยาวสูงสุดของอาร์เรย์ที่สร้างขึ้น
"85 @@ 86 @@ 53" .split ('@@'); // ['85', '86', '53']; "Banana" .split (); //["กล้วย"]; // (ขอบคุณ Peter (-:) "ประธาน, วุฒิสภา, House" .split (',', 2); // ["ประธานาธิบดี", "วุฒิสภา"] array.prototype.join (ตัวแยก)ตัวคั่นพารามิเตอร์เสริมแปลงอาร์เรย์เป็นสตริง หากไม่ได้ให้ตัวคั่นแล้วเครื่องหมายจุลภาคจะถูกใช้เป็นค่าพารามิเตอร์ (เช่นเดียวกับฟังก์ชั่น toString ของอาร์เรย์)
["Slugs", "หอยทาก", "หางสุนัขลูกสุนัข"] เข้าร่วม ('และ'); // "Slugs and Snails และ Puppy Dog's Tails" ['Giants', 4, 'Rangers', 1] .oin (''); // "ไจแอนต์ 4 เรนเจอร์ 1" [1962,1989,2002,2010] .oin ();นี่คือแอปพลิเคชันบางส่วน:
การเปลี่ยนใหม่
ฟังก์ชั่นง่าย ๆ นี้ไม่เหมือนกับฟังก์ชั่นการแทนที่ดั้งเดิม แต่สามารถแทนที่เป็นสตริงย่อยทั่วโลกโดยไม่ต้องใช้นิพจน์ทั่วไป
string.prototype.replaceall = function (ค้นหา, replacewith) {return this.split (ค้นหา) .Join (replacewith); } "The Man and the Plan" .replaceall ('The', 'A'); // "ผู้ชายและแผน"สำหรับสตริงขนาดเล็กมันอ่อนแอกว่าฟังก์ชั่นดั้งเดิมที่ถูกแทนที่ด้วยอักขระตัวเดียว (นี่หมายถึงฟังก์ชั่นเพิ่มเติมสองฟังก์ชั่นของนิพจน์ทั่วไป) แต่ภายใต้ Mozilla ถ้าตัวละครเกิน 2 หรือ 3 ตัวอักษรฟังก์ชั่นการใช้งานนี้ทำงานได้เร็วกว่านิพจน์ทั่วไป
เหตุการณ์ที่เกิดขึ้น
ฟังก์ชั่นนี้สามารถรับจำนวนย่อยที่ตรงกัน ยิ่งไปกว่านั้นฟังก์ชั่นประเภทนี้โดยตรงมากและไม่ต้องการความสม่ำเสมอ
string.prototype.occurences = function (ค้นหา, matchcase) {var text = this; Matchcase || (find = find.toLowerCase (), text = text.toLowerCase ()); ส่งคืน text.split (ค้นหา) .length-1; } document.body.innerhtml.occurences ("div"); // โฮมเพจ Google มี 114Document.body.innerhtml.occurences ("/div"); // โฮมเพจ Google มี 57 "อังกฤษเข้าร่วมวิศวกร" .OCCURNENCE ("อังกฤษ", จริง); // 2Repeatฟังก์ชั่นนี้ยืมมาจาก prototype.js:
string.prototype.repeat = ฟังก์ชั่น (ครั้ง) {ส่งคืนอาร์เรย์ใหม่ (เวลา+1) .Join (นี่); } "Go" .Repeat (3) + "Giants!"; // "Go Go Go Giants!"ความงามของมันอยู่ในการใช้ฟังก์ชั่นการเข้าร่วม โฟกัสอยู่ที่ค่าพารามิเตอร์ตัวคั่นนี้จากนั้นอาร์เรย์พื้นฐานนี้จะมีค่าค่าที่ไม่ได้กำหนดบางอย่างเท่านั้น เพื่อแสดงให้เห็นอย่างชัดเจนยิ่งขึ้นลองสร้างตัวอย่างข้างต้นใหม่:
[undefined, undefined, undefined, undefined] .oin ("go") + "ยักษ์โปรดจำไว้ว่าก่อนเข้าร่วมองค์ประกอบแต่ละอาร์เรย์จะถูกแปลงเป็นสตริง (นี่คือสตริงว่าง) แอปพลิเคชันของฟังก์ชั่นการทำซ้ำนี้เป็นหนึ่งในแอพพลิเคชั่นที่ไม่สามารถทำได้ไม่กี่แอปพลิเคชันที่กำหนดอาร์เรย์ผ่านตัวอักษรอาร์เรย์
ใช้พารามิเตอร์ขีด จำกัด
ฉันไม่ค่อยใช้พารามิเตอร์ตัวเลือกขีด จำกัด ของฟังก์ชั่นแยก นี่คือตัวอย่างที่ใช้ขีด จำกัด นี้:
var getDomain = function (url) {return url.split ('/', 3) .join ('/');} getDomain ("http://www.aneventapart.com/2010/seattle/slides/"); // "http: //www.anev entapart.com "getDomain (" https://addons.mozilla.org/en-us/firefox/bookmarks/ "); //" https://addons.mozilla.org "ปรับเปลี่ยนสมาชิกตัวเลข
หากเราผสมผสานการเข้าร่วมและแยกเป็นประจำสามารถแก้ไขสมาชิกอาเรย์ได้อย่างง่ายดาย อย่างไรก็ตามฟังก์ชั่นนี้ไม่ยากอย่างที่จินตนาการ ฟังก์ชั่นหลักคือการลบสตริงที่ระบุไว้ด้านหน้าของสมาชิกแต่ละคนของอาร์เรย์ที่กำหนด
var beheadMembers = function (arr, removestr) {var regex = regexp ("[,]?" + removestr); return arr.join (). split (regex) .slice (1);} // สร้างอาร์เรย์ที่มีเพียงส่วนตัวเลขของตัวเลขเที่ยวบินที่มีคนขาย (["BA015", "BA129", "BA130"]; // ["015", "129", "130"น่าเสียดายที่ฟังก์ชั่นนี้ล้มเหลวใน IE เพราะพวกเขาลบสมาชิกที่ว่างเปล่าคนแรกออกจากการแยกอย่างไม่ตั้งใจ ตอนนี้ให้แก้ไขฟังก์ชั่นนี้กันเถอะ:
var beheadMembers = function (arr, removestr) {var regex = regexp ("[,]?" + removestr); var result = arr.join (). แยก (regex); ส่งคืนผลลัพธ์ [0] && ผลลัพธ์ || result.slice (1); // คือวิธีแก้ปัญหา}ทำไมเราถึงใช้เทคนิคนี้แทนฟังก์ชั่นแผนที่ของอาร์เรย์ใน EmaScript 5?
["BA015", "BA129", "BA130"]. แผนที่ (ฟังก์ชั่น (e) {return e.replace ('ba', '')}); // ["015", "129", "130"]ในการใช้งานจริงเมื่อเป็นไปได้ฉันมักจะใช้ฟังก์ชั่นแผนที่ดั้งเดิม (ไม่สามารถใช้ได้ด้านล่างเช่น <9) ตัวอย่างต่อไปนี้ใช้เป็นเครื่องมือการเรียนรู้เท่านั้น แต่มันก็คุ้มค่าที่จะสังเกตว่าไวยากรณ์การโทรของการเข้าร่วมและการแยกนั้นกระชับและตรงไปตรงมามากขึ้น สิ่งที่น่าสนใจที่สุดก็มีประสิทธิภาพมากโดยเฉพาะอย่างยิ่งสำหรับอาร์เรย์ขนาดเล็กซึ่งมีประสิทธิภาพมากขึ้นใน FF และ Safari สำหรับอาร์เรย์ขนาดใหญ่ฟังก์ชั่นแผนที่เหมาะสมกว่า (ในเบราว์เซอร์ทั้งหมด) จะมีการเรียกใช้ฟังก์ชันน้อยลงเพื่อเข้าร่วมและแยกฟังก์ชั่น
// ทดสอบ 1-ใช้การเข้าร่วม/splitvar arr = [], x = 1000; ในขณะที่ (x--) {arr.push ("ba" + x);} var beheadmembers = ฟังก์ชั่น (arr, regex) {return arr.join () dit (regex). 1000; ในขณะที่ (y--) {beheadmembers (arr, regex);}; +วันที่ใหม่-ตัวจับเวลา; // ff 3.6 733ms // ch 7 464ms // sa 5 701ms // IE 8 1256ms // test 2-ใช้แผนที่พื้นเมือง arr = [], x = 1000; วันที่, y = 1000; ในขณะที่ (y--) {arr.map (ฟังก์ชั่น (e) {return e.replace ('ba', '')});}+วันที่ใหม่-ตัวจับเวลา; // ff 3.6 2051ms // cr 7 732ms // sf 5 1520ms // ie 8 (ไม่ได้รับการสนับสนุน)การจับคู่รูปแบบ
อาร์เรย์จำเป็นต้องทำการจับคู่รูปแบบอย่างต่อเนื่อง แต่สตริงไม่ได้ การแสดงออกปกติสามารถใช้ในสตริงได้ แต่ไม่ใช่ในอาร์เรย์ พลังของการแปลงอาร์เรย์เป็นสตริงสำหรับการจับคู่รูปแบบนั้นเกินขอบเขตของบทความนี้ ลองมาดูแอปพลิเคชั่นง่ายๆ
สมมติว่าผลการแข่งขันของการแข่งขันจำเป็นต้องได้รับการบันทึกไว้ในอาร์เรย์ จุดประสงค์คือการวางผู้เข้าแข่งขันและเวลาบันทึกของพวกเขาสลับกันในอาร์เรย์ เราสามารถใช้การเข้าร่วมและนิพจน์ทั่วไปเพื่อตรวจสอบว่ารูปแบบการจัดเก็บนี้ถูกต้องหรือไม่ รหัสต่อไปนี้คือการหาเวลาบันทึกที่ไม่ได้รับโดยมองหาชื่อสองชื่อติดต่อกัน
ผลลัพธ์ var = ['sunil', '23: 09 ',' bob ', '22: 09', 'carlos', 'Mary', '22: 59 ']; var baddata = results.oin (', '). การจับคู่ (/[a-za-z]+, [a-za-z]+/g); // ["Carlos, Mary"]