บทความนี้อธิบายกฎ 14 ข้อที่ควรปฏิบัติตามเมื่อเขียนรหัส JavaScript แบ่งปันสำหรับการอ้างอิงของคุณดังนี้:
1. ใช้ 'var' เสมอ
ใน JavaScript ตัวแปรเป็นทั่วโลกหรือทั่วทั้งฟังก์ชั่น การใช้คำหลัก "var" จะเป็นคีย์ในการรักษาตัวแปรที่กระชับและชัดเจน เมื่อประกาศตัวแปรที่เป็นระดับโลกหรือระดับฟังก์ชั่นคำหลัก "var" จะต้องนำหน้าก่อน ตัวอย่างต่อไปนี้จะเน้นปัญหาที่อาจเกิดขึ้นจากการไม่ทำเช่นนั้น
ปัญหาที่เกิดจากการไม่ใช้ VAR
var i = 0; // นี่เป็นสิ่งที่ดี - สร้างการทดสอบฟังก์ชั่นตัวแปรทั่วโลก () {สำหรับ (i = 0; i <10; i ++) {แจ้งเตือน ("สวัสดีโลก!");}} test (); แจ้งเตือน (i); // ตัวแปรส่วนกลางฉันตอนนี้ 10!เนื่องจากตัวแปร I ในฟังก์ชั่นตัวแปรไม่ได้ใช้ VAR เพื่อทำให้เป็นตัวแปรระดับฟังก์ชั่นในตัวอย่างนี้มันอ้างอิงตัวแปรส่วนกลาง การใช้ VAR เสมอเพื่อประกาศตัวแปรทั่วโลกเป็นวิธีปฏิบัติมากมาย แต่เป็นสิ่งสำคัญที่จะใช้ VAR เพื่อกำหนดตัวแปรทั่วทั้งฟังก์ชั่น สองวิธีต่อไปนี้ทำงานเหมือนกัน:
ฟังก์ชั่นที่ถูกต้อง
ฟังก์ชั่นทดสอบ () {var i = 0; สำหรับ (i = 0; i <10; i ++) {alert ("Hello World!");}}ฟังก์ชั่นที่ถูกต้อง
ฟังก์ชั่นทดสอบ () {สำหรับ (var i = 0; i <10; i ++) {alert ("Hello World!");}}2. การตรวจจับคุณสมบัติมากกว่าการตรวจจับเบราว์เซอร์
รหัสบางส่วนถูกเขียนขึ้นเพื่อค้นหาเวอร์ชันเบราว์เซอร์และดำเนินการพฤติกรรมที่แตกต่างกันตามไคลเอนต์ที่ผู้ใช้ใช้ โดยทั่วไปนี่เป็นวิธีปฏิบัติที่แย่มาก วิธีที่ดีกว่าคือการใช้การตรวจจับคุณสมบัติก่อนตรวจจับ (เบราว์เซอร์) ไม่ว่าจะมีคุณสมบัติหรือคุณสมบัตินี้ก่อนที่จะใช้คุณสมบัติขั้นสูงที่เบราว์เซอร์เก่าอาจไม่รองรับแล้วใช้ สิ่งนี้ตรวจพบรุ่นเบราว์เซอร์ได้ดีกว่าแม้ว่าคุณจะรู้ประสิทธิภาพของมันก็ตาม คุณสามารถค้นหาบทความที่กล่าวถึงปัญหานี้ในเชิงลึกได้ที่ http://www.jibbering.com/faq/faq_notes/not_browser_detect.html
ตัวอย่าง:
if (document.getElementById) {var element = document.getElementById ('myId');} else {alert ('เบราว์เซอร์ของคุณขาดความสามารถที่จำเป็นในการเรียกใช้สคริปต์นี้!');}3. ใช้สัญลักษณ์วงเล็บเหลี่ยม
เมื่อการเข้าถึงถูกกำหนดโดยการดำเนินการหรือรวมถึงคุณสมบัติของวัตถุที่ไม่สามารถเข้าถึงได้ด้วย " สัญลักษณ์มีการใช้สัญลักษณ์วงเล็บเหลี่ยม หากคุณไม่ใช่โปรแกรมเมอร์ JavaScript ที่มีประสบการณ์การใช้วงเล็บสี่เหลี่ยมเสมอเป็นวิธีที่ดีในการทำ
คุณสมบัติของวัตถุสามารถเข้าถึงได้โดยสองวิธีที่คงที่: "." คำนามและ "[]" สัญลักษณ์วงเล็บตาราง:
- วิธีสัญกรณ์:
myobject.property
"[]" สัญลักษณ์วงเล็บตาราง:
myObject ["คุณสมบัติ"]
ใช้ "." ลงชื่อชื่อแอตทริบิวต์เป็นรหัสยากและไม่สามารถเปลี่ยนแปลงได้ในระหว่างการดำเนินการ การใช้วงเล็บสี่เหลี่ยม "[]" ชื่อแอตทริบิวต์เป็นสตริงที่มาจากการคำนวณชื่อแอตทริบิวต์ สตริงควรเป็นรหัสยากหรือตัวแปรหรือแม้แต่ฟังก์ชั่นที่เรียกคืนค่าสตริง หากชื่อแอตทริบิวต์ถูกสร้างขึ้นในระหว่างการดำเนินการจำเป็นต้องใช้วงเล็บเหลี่ยม หากคุณมีคุณสมบัติเช่น "value1", "value2" และ "value3" และต้องการใช้ตัวแปร i = 2 เพื่อเข้าถึง
สิ่งนี้สามารถเรียกใช้:
myObject ["value"+i]
สิ่งนี้ไม่สามารถ:
myobject.value+i
และในสภาพแวดล้อมฝั่งเซิร์ฟเวอร์บางแห่ง (PHP, struts ฯลฯ ) รูปแบบฟอร์มจะถูกแนบกับตัวเลข [] เพื่อระบุว่ารูปแบบฟอร์มจะต้องได้รับการปฏิบัติเป็นอาร์เรย์ทางฝั่งเซิร์ฟเวอร์ ด้วยวิธีนี้ใช้ "." เครื่องหมายเพื่ออ้างถึงฟิลด์ที่มีเครื่องหมาย [] จะไม่ถูกดำเนินการเนื่องจาก [] เป็นไวยากรณ์สำหรับการอ้างถึงอาร์เรย์ JavaScript ดังนั้น [] สัญกรณ์จึงจำเป็น:
สิ่งนี้สามารถเรียกใช้:
formref.elements ["name []"]
สิ่งนี้ไม่สามารถ:
formref.elements.name []
การใช้สัญลักษณ์วงเล็บสี่เหลี่ยม "[]" ที่แนะนำหมายความว่ามันจะใช้เสมอเมื่อต้องการ (เห็นได้ชัด) มันเป็นความชอบส่วนตัวและนิสัยเมื่อไม่จำเป็นต้องใช้อย่างเคร่งครัด หลักการเชิงประจักษ์ที่ดีคือการใช้ "." สัญกรณ์เพื่อเข้าถึงคุณสมบัติวัตถุมาตรฐานและใช้สัญลักษณ์วงเล็บเหลี่ยม "[]" เพื่อเข้าถึงคุณสมบัติวัตถุที่กำหนดโดยหน้า ด้วยวิธีนี้เอกสาร ["GetElementById"] () เป็นสิ่งที่เป็นไปได้อย่างสมบูรณ์แบบ "[]" การใช้สัญลักษณ์ของวงเล็บเหลี่ยม แต่ document.getElementById () เป็นที่ต้องการของระบบทางเลือก ผสมสัญลักษณ์ทั้งสองนี้เพื่อให้เป็นแอตทริบิวต์วัตถุมาตรฐานและชื่อแอตทริบิวต์ใดที่กำหนดโดยบริบททำให้ชัดเจนในรหัส:
document.forms ["myFormName"]. องค์ประกอบ ["myInput"] ค่า
ที่นี่แบบฟอร์มเป็นคุณสมบัติมาตรฐานของเอกสารและชื่อรูปแบบ myFormName ถูกกำหนดโดยหน้า ในเวลาเดียวกันองค์ประกอบและแอตทริบิวต์ค่าเป็นทั้งแอตทริบิวต์มาตรฐานที่กำหนดโดยข้อกำหนด MyInput ถูกกำหนดโดยหน้า หน้านี้เป็นไวยากรณ์ที่ทำให้คนเข้าใจง่ายมาก (เนื้อหาของรหัส) และเป็นสำนวนที่แนะนำ แต่ไม่ใช่หลักการที่เข้มงวด
4. หลีกเลี่ยง 'ประเมิน'
ใน JavaScript ฟังก์ชั่น eval () เป็นวิธีการเรียกใช้รหัสโดยพลการระหว่างการดำเนินการ ในเกือบทุกกรณีไม่ควรใช้การประเมิน หากปรากฏในหน้าของคุณหมายความว่ามีวิธีที่ดีกว่าในสิ่งที่คุณกำลังทำ ตัวอย่างเช่นการประเมินมักใช้โดยโปรแกรมเมอร์ที่ไม่ทราบว่าจะใช้สัญลักษณ์วงเล็บเหลี่ยม
โดยหลักการแล้ว "การประเมินคือความชั่วร้าย (ประเมินคือปีศาจ) อย่าใช้มันเว้นแต่คุณจะเป็นนักพัฒนาที่มีประสบการณ์และรู้ว่าสถานการณ์ของคุณเป็นข้อยกเว้น
5. การอ้างอิงที่ถูกต้องไปยังรูปแบบและองค์ประกอบแบบฟอร์ม
แบบฟอร์ม HTML ทั้งหมดควรมีแอตทริบิวต์ชื่อ สำหรับเอกสาร XHTML ไม่จำเป็นต้องใช้แอตทริบิวต์ชื่อ แต่แท็กฟอร์มควรมีแอตทริบิวต์ ID ที่สอดคล้องกันและต้องอ้างอิงด้วย document.getElementById () การใช้วิธีการจัดทำดัชนีเช่น document.forms [0] ไปยังแบบฟอร์มอ้างอิงเป็นวิธีปฏิบัติที่ไม่ดีในเกือบทุกกรณี เบราว์เซอร์บางตัวปฏิบัติต่อองค์ประกอบที่มีชื่ออยู่ในเอกสารโดยใช้แบบฟอร์มเป็นแอตทริบิวต์แบบฟอร์มที่มีอยู่ สิ่งนี้ไม่น่าเชื่อถือและไม่ควรใช้
ตัวอย่างต่อไปนี้แสดงวิธีป้องกันการอ้างอิงที่ไม่ถูกต้องของอินพุตแบบฟอร์มโดยใช้วงเล็บเหลี่ยมและวิธีการอ้างอิงวัตถุที่ถูกต้อง:
อินพุตแบบฟอร์มอ้างอิงที่ถูกต้อง:
document.forms ["formname"]. องค์ประกอบ ["inputName"]
วิธีที่ไม่ดี:
document.formname.inputName
หากคุณต้องการอ้างอิงองค์ประกอบสองรูปแบบในฟังก์ชั่นจะเป็นการดีกว่าที่จะอ้างถึงวัตถุฟอร์มก่อนและเก็บไว้ในตัวแปร ซึ่งจะหลีกเลี่ยงการสืบค้นซ้ำเพื่อแก้ไขการอ้างอิงแบบฟอร์ม:
var formelements = document.forms ["mainform"]. องค์ประกอบ; formElements ["input1"]. value = "a"; formElements ["input2"]. value = "B";
เมื่อคุณใช้วิธีการจัดการเหตุการณ์ที่คล้ายกันอื่น ๆ วิธีการที่ดีคือการอ้างถึงองค์ประกอบอินพุตเองในฟังก์ชั่นผ่านรายการ องค์ประกอบอินพุตทั้งหมดมีการอ้างอิงไปยังแบบฟอร์มที่มี:
<อินพุต type = "text" name = "address" onChange = "ตรวจสอบ (สิ่งนี้)">
ฟังก์ชั่นตรวจสอบ (input_obj) {// การอ้างอิง formvar theform ที่มีองค์ประกอบนี้ = input_obj.form; // ตอนนี้คุณสามารถอ้างถึงแบบฟอร์มเองโดยไม่ต้องใช้รหัสยากถ้า (Theform.Elements ["City"]. value == "") {แจ้งเตือน ("ข้อผิดพลาด");}}โดยการเข้าถึงคุณสมบัติของแบบฟอร์มโดยการอ้างอิงองค์ประกอบฟอร์มคุณสามารถเขียนฟังก์ชั่นที่ไม่มีรหัสยากเพื่ออ้างถึงแบบฟอร์มใด ๆ ในหน้านี้ด้วยชื่อเฉพาะ นี่เป็นแนวปฏิบัติที่ดีมากเพราะฟังก์ชั่นกลายเป็นสิ่งที่นำกลับมาใช้ใหม่ได้
หลีกเลี่ยง 'ด้วย'
ด้วยการประกาศในจาวาสคริปต์แทรกวัตถุที่ปลายด้านหน้าของขอบเขตดังนั้นการอ้างอิงใด ๆ กับแอตทริบิวต์/ตัวแปรจะได้รับการแก้ไขก่อนตามวัตถุ สิ่งนี้มักใช้เป็นทางลัดเพื่อหลีกเลี่ยงการอ้างอิงซ้ำ:
ตัวอย่างของการใช้กับ:
ด้วย (document.forms ["mainform"]. องค์ประกอบ) {input1.value = "junk"; input2.value = "junk";}แต่ปัญหาคือโปรแกรมเมอร์ไม่มีวิธีตรวจสอบว่าอินพุต 1 หรืออินพุต 2 ได้รับการแก้ไขเป็นคุณสมบัติของอาร์เรย์องค์ประกอบแบบฟอร์ม ก่อนอื่นจะตรวจจับแอตทริบิวต์ด้วยค่าชื่อเหล่านี้และหากไม่สามารถพบได้มันจะยังคงตรวจจับขอบเขตนี้ (ลง) ในที่สุดมันก็พยายามที่จะปฏิบัติต่ออินพุต 1 และอินพุต 2 เป็นวัตถุระดับโลกและจบลงด้วยข้อผิดพลาด
วิธีแก้ปัญหาคือการสร้างวัตถุที่ลดการอ้างอิงและใช้เพื่อแก้ไขการอ้างอิงเหล่านี้
ใช้ข้อมูลอ้างอิง:
องค์ประกอบ var = document.forms ["mainform"]. องค์ประกอบ; Elements.input1.value = "junk"; elements.input2.value = "ขยะ";
7. ใช้ "onclick" ใน Anchor แทน "JavaScript: Pseudo-Protocol"
หากคุณต้องการเรียกใช้รหัส JavaScript ในแท็ก <a> ให้เลือก onClick แทน JavaScript: pseudo-protocol; รหัส JavaScript ที่ทำงานโดยใช้ onClick จะต้องส่งคืน ture หรือ false (หรือนิพจน์มากกว่าการประเมินผลเป็นจริงหรือเท็จ [วิธีการแปลประโยคนี้ฉันเข้าใจด้วยวิธีนี้: นิพจน์ที่มีลำดับความสำคัญเหนือจริงหรือเท็จ]) เพื่อส่งคืนแท็กเอง: ถ้าเป็นจริง หากเท็จ HREF จะถูกละเว้น นั่นเป็นเหตุผลว่าทำไม "กลับมาเป็นเท็จ" มักจะรวมอยู่ในตอนท้ายของรหัสที่ประมวลผลโดย onclick
ไวยากรณ์ที่ถูกต้อง:
คัดลอกรหัสดังนี้: <a href = "// www.vevb.com" onclick = "dosomething (); return false;"> go </a>
ในอินสแตนซ์นี้ฟังก์ชั่น "Dosomething ()" (กำหนดไว้ในมุมหนึ่งของหน้า) จะถูกเรียกเมื่อคลิก HREF จะไม่สามารถเข้าถึงได้โดยเบราว์เซอร์ที่เปิดใช้งาน JavaScript เอกสาร javascript_required.html จะถูกโหลดในเบราว์เซอร์ที่คุณสามารถเตือน JavaScript ที่จำเป็นและไม่ได้เปิดใช้งานโดยผู้ใช้ โดยปกติเมื่อคุณตรวจสอบให้แน่ใจว่าผู้ใช้จะเปิดใช้งานการสนับสนุน JavaScript ให้มากที่สุดเท่าที่จะเป็นไปได้ลิงค์จะรวม HREF = "#" เท่านั้น และวิธีการนี้ไม่ได้รับการสนับสนุน โดยปกติจะมีวิธีการที่ดี: สามารถให้หน้าเว็บที่กลับไปยังพื้นที่ท้องถิ่นโดยไม่ต้องใช้ JavaScript
บางครั้งหลายคนต้องการเยี่ยมชมลิงค์ตามสถานการณ์ ตัวอย่างเช่นเมื่อผู้ใช้ต้องการออกจากหน้าฟอร์มของคุณและต้องการตรวจสอบก่อนเพื่อให้แน่ใจว่าไม่มีอะไรเปลี่ยนแปลง ในกรณีนี้ onclick ของคุณจะเข้าถึงฟังก์ชั่นที่ส่งคืนแบบสอบถามว่าควรติดตามลิงค์หรือไม่:
การเข้าถึงลิงค์แบบมีเงื่อนไข:
<a href = "/" onclick = "return validate ();"> home </a>
ฟังก์ชั่นตรวจสอบ () {return prompt ("แน่ใจหรือว่าคุณต้องการออกจากหน้านี้?");}ในอินสแตนซ์นี้ฟังก์ชั่นการตรวจสอบ () จะต้องส่งคืนเฉพาะ ture หรือ false เท่านั้น เมื่อผู้ใช้อยู่ใน TURE ผู้ใช้จะได้รับอนุญาตให้ออกหน้าแรกหรือเมื่อไม่สามารถเข้าถึงลิงค์ได้ ตัวอย่างนี้แจ้งการยืนยัน (พฤติกรรมของมัน) เพื่อเข้าถึง ture หรือ false ซึ่งถูกกำหนดโดยผู้ใช้คลิก "ของจริง" หรือ "ยกเลิก"
นี่คือตัวอย่างของ "ไม่ควรเป็น" หากคุณเห็นรหัสต่อไปนี้ในหน้าของคุณสิ่งนี้ไม่ถูกต้องและจำเป็นต้องแก้ไข:
สิ่งที่ไม่ควรทำ:
<a href = "javascript: dosomething ()"> ลิงก์ </a> <a href = "// www.vevb.com/#" onclick = "dosomething ()"> link </a> <a href = "// www.vevb.com/# href = "// www.vevb.com/#" onclick = "JavaScript: dosomething (); return false;"> ลิงก์ </a>
8. ใช้ตัวดำเนินการ unary '+' เพื่อเปลี่ยนประเภทเป็นหมายเลข
ใน JavaScript ตัวดำเนินการป้าย "+" ทำหน้าที่เป็นทั้งสัญญาณคณิตศาสตร์บวกและตัวเชื่อมต่อ สิ่งนี้อาจทำให้เกิดปัญหาเมื่อมีการเพิ่มค่าฟิลด์ของแบบฟอร์มเข้าด้วยกัน ตัวอย่างเช่นเนื่องจาก JavaScript เป็นภาษาประเภทที่อ่อนแอค่าของฟิลด์ฟอร์มจะถูกประมวลผลเป็นอาร์เรย์และเมื่อคุณพาพวกเขามารวมกัน "+" จะได้รับการปฏิบัติเป็นตัวเชื่อมต่อไม่ใช่สัญญาณทางคณิตศาสตร์บวก
ตัวอย่างของปัญหา:
<form name = "myform" action = "[url]"> <input type = "text" name = "val1" value = "1"> <อินพุต type = "text" name = "val2" value = "2"> </form>
ฟังก์ชั่นทั้งหมด () {var theform = document.forms ["myform"]; var total = theform.elements ["val1"]. value + theform.elements ["val2"]. ค่า; การแจ้งเตือน (ทั้งหมด); // สิ่งนี้จะปรากฏขึ้น "12" แต่สิ่งที่คุณต้องการคือ 3!}เพื่อแก้ปัญหานี้ JavaScript จำเป็นต้องมีการแจ้งเตือนเพื่อให้ประมวลผลค่าเหล่านี้เป็นตัวเลข คุณสามารถใช้เครื่องหมาย "+" เพื่อแปลงอาร์เรย์เป็นตัวเลข การนำเสนอตัวแปรหรือนิพจน์ด้วยเครื่องหมาย "+" จะบังคับให้ประมวลผลเป็นตัวเลขและสิ่งนี้จะช่วยให้ใช้คณิตศาสตร์ "+" ได้สำเร็จ
รหัสแก้ไข:
ฟังก์ชั่นทั้งหมด () {var theform = document.forms ["myform"]; var total = (+theform.elements ["val1"]. value)+(+theform.elements ["val2"]. ค่า); แจ้งเตือน (ทั้งหมด); // สิ่งนี้จะแจ้งเตือน 3}9. หลีกเลี่ยงเอกสารทั้งหมด
Document.all ได้รับการแนะนำโดย IE ของ Microsoft และไม่ใช่คุณสมบัติ JavaScript DOM มาตรฐาน แม้ว่าเบราว์เซอร์ใหม่ส่วนใหญ่จะรองรับมันเพื่อรองรับรหัสที่ไม่ดีที่ขึ้นอยู่กับ (และ) มีเบราว์เซอร์จำนวนมากที่ไม่รองรับ
ไม่มีเหตุผลที่วิธีการอื่นไม่สามารถใช้งานได้และเบราว์เซอร์ IE เก่า (<5.0) ต้องการการสนับสนุนและเอกสารทั้งหมดที่ใช้ใน JavaScript เป็นการแลกเปลี่ยน คุณไม่จำเป็นต้องใช้เอกสารทั้งหมดเพื่อตรวจสอบว่าเป็นเบราว์เซอร์ IE หรือไม่เพราะเบราว์เซอร์อื่น ๆ โดยทั่วไปรองรับ
document.all เป็นตัวเลือกสุดท้าย:
if (document.getElementById) {var obj = document.getElementById ("myId");} อื่นถ้า (document.all) {var obj = document.all ("myId");}หลักการบางประการสำหรับการใช้ document.all:
ลองใช้วิธีอื่น
เมื่อเป็นตัวเลือกสุดท้าย
เมื่อจำเป็นต้องสนับสนุนเบราว์เซอร์ IE ด้านล่างเวอร์ชัน 5.0
ใช้ "if (document.all) {}" เสมอเพื่อดูว่ารองรับหรือไม่
10. อย่าใช้ความคิดเห็น HTML ในบล็อกรหัสสคริปต์
ในสมัยเก่าของ JavaScript (1995) เบราว์เซอร์บางตัวเช่น NetScape 1.0 ไม่สนับสนุนหรือรับรู้แท็ก <Script> ดังนั้นเมื่อ JavaScript เปิดตัวครั้งแรกมีเทคโนโลยีที่จะป้องกันไม่ให้รหัสจริงที่แสดงบนเบราว์เซอร์รุ่นเก่าเป็นข้อความ มี "แฮ็ค" ที่ใช้ความคิดเห็น HTML ในรหัสเพื่อซ่อนรหัสเหล่านี้
การทำให้ความคิดเห็น HTML ไม่ดี:
<script language = "javascript"> <!-// รหัสที่นี่ //-> </script>
วันนี้ไม่มีเบราว์เซอร์ที่ใช้กันทั่วไปละเว้นแท็ก <script> ดังนั้นจึงไม่จำเป็นต้องซ่อนซอร์สโค้ด JavaScript อีกต่อไป ในความเป็นจริงมันสามารถพิจารณาได้ว่าไม่ช่วยเหลือด้วยเหตุผลดังต่อไปนี้:
ในเอกสาร XHTML ซอร์สโค้ดจะถูกซ่อนจากเบราว์เซอร์ทั้งหมดและแสดงผลเป็นไร้ประโยชน์ (เนื้อหา);
ไม่อนุญาตให้ใช้ความคิดเห็น HTML ซึ่งจะทำให้การลดลงของการลดลงใด ๆ
11. หลีกเลี่ยงการใช้เนมสเปซทั่วโลกโดยไม่เลือกปฏิบัติ
โดยทั่วไปตัวแปรและฟังก์ชั่นทั้งหมดไม่ค่อยจำเป็น การใช้งานทั่วโลกอาจทำให้เอกสารไฟล์ต้นฉบับ JavaScript ขัดแย้งและยกเลิกรหัส ดังนั้นวิธีการที่ดีคือการใช้การห่อหุ้มการทำงานภายในเนมสเปซทั่วโลก มีหลายวิธีในการทำงานนี้ให้เสร็จซึ่งค่อนข้างซับซ้อน วิธีที่ง่ายที่สุดคือการสร้างวัตถุระดับโลกและกำหนดคุณสมบัติและวิธีการให้กับวัตถุนี้:
สร้างเนมสเปซ:
var mylib = {}; // วัตถุทั่วโลก containermylib.value = 1; mylib.increment = function () {mylib.value ++;} mylib.show = function () {alert (mylib.value);} mylib.value = 6; mylib.increment (); mylib.show (); // การแจ้งเตือน 7เนมสเปซยังสามารถสร้างขึ้นได้โดยใช้การปิดและตัวแปรสมาชิกส่วนตัวสามารถปลอมตัวใน JavaScript
12. หลีกเลี่ยงการโทร 'Ajax' แบบซิงโครนัส
เมื่อใช้คำขอ "AJAX" คุณจะเลือกโหมดอะซิงโครนัสหรือใช้โหมดซิงโครนัส เมื่อพฤติกรรมของเบราว์เซอร์สามารถดำเนินการต่อไปได้โหมดอะซิงโครนัสจะวางคำขอไว้ในพื้นหลังและโหมดซิงโครนัสจะรอจนกว่าคำขอจะเสร็จสมบูรณ์ก่อนดำเนินการต่อ
ควรหลีกเลี่ยงการร้องขอในโหมดการซิงโครไนซ์ คำขอเหล่านี้จะปิดการใช้งานเบราว์เซอร์ให้กับผู้ใช้จนกว่าคำขอจะส่งคืน เมื่อเซิร์ฟเวอร์ไม่ว่างและใช้เวลาพอสมควรในการร้องขอเบราว์เซอร์ของผู้ใช้ (หรือระบบปฏิบัติการ) จะไม่สามารถทำอะไรได้จนกว่าคำขอจะหมดเวลา
หากคุณรู้สึกว่าสถานการณ์ของคุณต้องใช้โหมดการซิงโครไนซ์ความเป็นไปได้ที่ยิ่งใหญ่ที่สุดคือคุณต้องใช้เวลาในการคิดใหม่การออกแบบของคุณ ไม่ค่อยมีการร้องขอ AJAX ในโหมดซิงโครนัสจริง ๆ
13. ใช้ JSON
เมื่อจำเป็นต้องจัดเก็บโครงสร้างข้อมูลลงในข้อความธรรมดาหรือส่ง/ดึงโครงสร้างข้อมูลผ่าน AJAX ให้ใช้ JSON แทน XML ให้มากที่สุด JSON (Notation Object JavaScript) เป็นรูปแบบการจัดเก็บข้อมูลที่กระชับและมีประสิทธิภาพมากขึ้นและไม่พึ่งพาภาษาใด ๆ (และเป็นภาษาที่เป็นกลาง)
14. ใช้แท็ก <Script> ที่ถูกต้อง
การใช้คุณสมบัติภาษาใน <Script> ไม่ได้รับการสนับสนุน วิธีที่เหมาะสมคือการสร้างบล็อกรหัส JavaScript ต่อไปนี้:
<script type = "text/javascript"> // รหัสที่นี่ </script>
PS: รหัสข้างต้นยังไม่ได้รับการจัดรูปแบบและรหัสที่จัดรูปแบบมักจะอ่านและเข้าใจได้ง่ายขึ้น นี่คือเครื่องมือจัดรูปแบบและการบีบอัดออนไลน์บางอย่างเพื่อให้คุณใช้ในการพัฒนาในอนาคต:
เครื่องมือการตกแต่งและการจัดรูปแบบรหัส JavaScript ออนไลน์:
http://tools.vevb.com/code/js
JavaScript Code Beautification/การบีบอัด/การจัดรูปแบบ/เครื่องมือเข้ารหัส:
http://tools.vevb.com/code/jscompress
JSMIN ONLINE JS Tool Tool:
http://tools.vevb.com/code/jsmincompress
JSON CODE การจัดรูปแบบออนไลน์/การตกแต่ง/การบีบอัด/แก้ไข/แปลงเครื่องมือ:
http://tools.vevb.com/code/jsoncodeformat
สำหรับข้อมูลเพิ่มเติมเกี่ยวกับเนื้อหาที่เกี่ยวข้องกับ JavaScript โปรดตรวจสอบหัวข้อของไซต์นี้: "สรุปเอฟเฟกต์และเทคนิคการสลับ JavaScript", "สรุปทักษะอัลกอริธึมการค้นหา JavaScript", "สรุปผลการสรุปและเทคนิคการสรุปของ JavaScript ของ JavaScript อัลกอริทึมและเทคนิคการสำรวจ JavaScript "และ" สรุปการใช้งานทางคณิตศาสตร์ JavaScript "
ฉันหวังว่าบทความนี้จะเป็นประโยชน์กับการเขียนโปรแกรม JavaScript ของทุกคน