Saturday, July 29, 2006

Prototype กับ Legacy javascript project

อ่านเจอประเด็น Prototype conflict กับ Legacy project
แต่ก็ไม่ได้สนใจอะไร เพราะนึกไม่ออกว่ามันจะ conflict กันตรงไหน
(ตอนแรกนึกว่าเป็นเรื่อง name conflict)

วันนี้อ่านเจอ case ตัวอย่างใน How Prototype Can Break Your Site
ของ code_poet
เขายกตัวอย่างง่ายๆว่า
var a = new Array();
a[0] = 1;
a[1] = 2;
for (var i in a) {
print(i + " = "+ a[i]);
}

code ข้างบนก็ดูเรียบๆตรงไปตรงมา ไม่น่าผิดปกติตรงไหน
แต่ถ้าเมื่อไรก็ตามที่เรา include Prototype เข้ามา
code ข้างบนจะทำงานผิดไปจากเดิม
โดยผลลัพท์ที่ได้จะหน้าตาแบบนี้แทน
0 = 1 
1 = 2
each = function() { }
iterate = function() { }


สาเหตุเป็นเพราะ
  • Prototype มีการ extends Array class ของ javascript
    เพื่อเพิ่ม feature เกี่ยวกับการ iterate
  • loop code ใช้วิธี loop array แบบพิสดารไปหน่อย
    คือแทนที่จะใช้ for (var i = 0; i < a.length; i++)
    กลับไปใช้ for (var i in a) แทน

Related link from Roti

2 comments:

bact' said...

ความแตกต่างระหว่างการ iterate สองแบบ
อะไรนิด ๆ หน่อย ๆ แบบนี้นี่หายาก และมักจะทำให้ปวดหัว - -"

หรือเป็นเพราะหนังสือ/เอกสาร/ตัวอย่าง JavaScript แบบเจาะลึกมันมีน้อย / คนไม่ค่อยนิยมอ่าน / ชอบเรียนรู้เองจากการลองผิดลองถูก .... พอเ้ห็นว่าบางอย่างมัน ทำงานได้ ก็อนุมานเอาเองว่า มันถูก ?

ผมก็โดนเองอยู่เรื่อย ๆ :P

veer said...

แบบนี้นี่เอง ผมก็งงๆอยู่นาน มีแบบเปลี่ยนไปใช้ $A(...).each(...); ด้วย :-P