สำหรับคนอย่างผมที่ไม่ได้เรียน JavaScript อย่างเป็นระบบในตอนแรก ความรู้สึกแรกที่เห็นสิ่งที่มีคือความตื่นเต้น ไม่ต้องเขียน "element.style.xxx = ..." ซ้ำๆ กันก็แค่
ดู สำเนาธรรมดาถึงคลิปบอร์ดพิมพ์?
ด้วย (element.style) {
xxx = ...;
ปปป = ...;
-
}
ด้วย (element.style) {
xxx = ...;
ปปป = ...;
-
}แต่เนื่องจากเป็นภาษาที่ตีความ JavaScript จำเป็นต้องพิจารณาว่า xxx/yyy คืออะไรในขณะรันไทม์ สำหรับแต่ละชื่อ (ไม่ใช่แค่กำหนด แต่ยังอ่านตัวแปรด้วย!) ขั้นแรกจะค้นหาคุณสมบัติของอ็อบเจ็กต์ในวงเล็บ จากนั้นตามด้วยตัวแปรโลคัล และสุดท้ายคือตัวแปรโกลบอล ก่อนที่เครื่องเสมือน JavaScript และเทคโนโลยี JIT จะได้รับความนิยม ปัญหาด้านประสิทธิภาพประเภทนี้จำเป็นต้องได้รับการดูแลเป็นอย่างดี
วิธีที่ถูกต้องคือการสร้างแคชตัวแปรโลคัลสำหรับ element.style:
view plaincopy to clipboardprint?
วาเรส = element.style;
es.xxx = ...;
es.yyy = ...;
...
var es = element.style;
es.xxx = ...;
es.yyy = ...;
...ซึ่งไม่เพียงแต่ลดขนาดโค้ดลงเท่านั้น แต่ยังทำงานได้ดีกว่า element.style.xxx = ....