JavaScript

I got this book from FOWA and left it on my desk (along with other FOWA souvenirs). When I was interested in AIR, I go googling first and never realized that I already have a good AIR guide one-foot-away.

(cover picture from O'Reilly)

The Adobe Integrated Runtime (AIR) for JavaScript Developers Pocket Guide is written by Adobe developers and published by O'Reilly. It gives a good introduction to develop an AIR application by HTML/JavaScript, not Flash/Flex.

ได้ยินชื่อเสียงมานาน วันนี้ได้ฤกษ์อ่าน JSON

ให้อธิบายสั้นๆ เนื่องจาก XML มันรก วงเล็บปีกกาเต็มไปหมด ถ้าต้องการแลกเปลี่ยนข้อมูลสั้นๆ ก็ไม่คุ้มที่จะใช้ XML ดังนั้นเราหาวิธีอื่นที่จะอธิบาย object แบบง่ายๆ ดีกว่า JSON ใช้ datatype ของภาษาโปรแกรมที่คนอ่านเข้าใจง่ายกว่า XML แทน แค่นี้เอง

ตอนแรกภาษาโปรแกรมที่ใช้คือ JavaScript (เลยชื่อ JSON) แต่ตอนนี้แทบทุกภาษามี JSON Parser/Generator แล้ว

ถ้ามองในภาพรวม ต้องเอาไปเปรียบเทียบกับ SOAP และ XML-RPC ด้วย

• XML
  • SOAP - มันซับซ้อนมากจน Google ยังเลิกใช้
  • XML-RPC - ลดความซับซ้อนลงมา แต่ก็ยังเป็น XML
• Non-XML
  • JSON - ลดความซับซ้อนอีก เสียฟีเจอร์บางอันที่เกี่ยวกับ RPC ไป แต่ส่วนมากเราไม่ใช้อยู่แล้วนี่

เพื่อความเข้าใจง่าย ดูโค้ดเร็วที่สุด อ่าน เปรียบเทียบ SOAP vs XML-RPC และ โค้ดเดียวกันในรูป JSON

Brendan Eich (Mozilla Corporation และคนสร้าง JavaScript) พูดในงาน XTech 2006 เกี่ยวกับ JavaScript 2.0 และอนาคตของเว็บ

สไลด์มาเป็น S5 (เคยเขียนไปแล้ว) เท่าที่ลองพบว่า S5 มันด้อยตรงเลือกหน้าที่ต้องการไม่ได้ ทำได้แค่ไปหน้ากับถอยหลังทีละแผ่น

เนื่องจากสไลด์มันยาว 46 แผ่นแถมมีแต่โค้ด (ตาลายแถมขี้เกียจ) อ่านผ่านๆ ได้ใจความว่าสเปก JavaScript 2.0 เดิมที่เสนอโดย Netscape มาตั้งนานแล้วเสียงตอบรับไม่ดี มีการเปลี่ยนแปลงจากเดิมเยอะ และสืบทอดข้อบกพร่องหลายอย่างจาก Java/C#

Eich จึงเสนอแผนใหม่สำหรับ JavaScript 2 ให้กับ ECMA โดยออกได้อย่างเร็วก็ปลาย 2007 ไม่ทัน Firefox 3 แต่เค้ามองว่าใช้ในอนาคตไกลกว่านั้นอีก

ส่วนเรื่องสเปก มีการแก้บั๊กเก่าโดยเฉพาะบั๊กที่ตัวเลขมันไม่ใช่จำนวนเต็มจริงๆ (อ่านที่ลิ่วเขียน) , syntax และ type ใหม่ๆ หลายตัว เช่น decimal, ตัวสำคัญคือ variable ใหม่ชื่อ "let" ซึ่งจะทำให้บล็อคของโค้ดเขียนง่ายขึ้น มีใช้เยอะเหมือนกันในตัวอย่างโค้ดตามสไลด์

Netvibes เป็นเว็บพอร์ทัลที่ใช้ AJAX/JavaScript หนักมาก วันก่อนเอาให้พี่ต้นกำธรลองเล่นดูก็ชอบใจใหญ่ ส่วนเอฟเฟคต์ที่ง่ายๆ แต่ดูดีคือ title ของเพจที่คลิกแล้วแก้ไขได้เลย

ตรงนี้มันใช้ 2 อย่างผสมกัน คือ JavaScript ไว้แสดงเอฟเฟคต์เดี๋ยวนั้น กับ AJAX ในการส่งค่า title ไปเก็บไว้ที่เซิร์ฟเวอร์

ส่วนของ AJAX นั้นจะทำคล้ายๆ ตัวอย่างนี้ (ใช้ Prototype เป็นไลบรารีซึ่งก็สะดวกดี)

แต่ในส่วนของเอฟเฟคต์ไม่รู้ทำยังไง เลยแกะโค้ดแล้วลองเขียนตามซะเลย

เวลาจะหัดเขียนโปรแกรมภาษาใหม่ซักภาษา เดี๋ยวนี้เรามี tutorial จำพวก Beginner's Guide to ... ซึ่งก็สะดวกมากสำหรับผู้ใช้หน้าใหม่ว่าอะไรเป็นอะไร แต่สำหรับคนที่มีพื้นโปรแกรมมิ่งนิดหน่อยอยู่แล้ว (แบบผม) จะมานั่งอ่านวิธีใช้ for loop, while loop ทุกครั้งมันก็ไม่ใช่เรื่องสนุก พวกนี้ดูตัวอย่างในโค้ดในเขียนตามง่ายกว่าเยอะ สิ่งที่ขาดไป (และยังไม่ค่อยมี) คือ guide ที่บอกว่ามีจุดสำคัญตรงไหนที่เปลี่ยนไปจากภาษาเดิมและ language reference ที่ครบๆ ดีๆ ตะหาก

JavaScript เป็นภาษาที่ออกแบบมาสำหรับเว็บเบราว์เซอร์โดยเฉพาะ ดังนั้นมันจะต่างจากภาษาอื่นๆ ที่ออกแบบมากลาง เพราะแทนที่เอาท์พุทจะออก console มันจะไปออกหน้าต่างของเบราว์เซอร์แทน

สมมติว่าเป็น C# จะใช้

System.Console.WriteLine("Hello");

พอเป็น JavaScript

document.write("Hello"); // สำหรับตัวเพจ
หรือ
window.status("Hello"); // ที่ statusbar ก็ได้

จะเห็นว่าส่วนประกอบของเบราว์เซอร์ (ในกรณีนี้คือ statusbar กรณีอื่นก็พวก urlbar, titlebar, link, form ต่างๆ) จะถือเป็น object ปริยายอยู่แล้ว ดังนั้นอันที่ยากคือเราจะรู้ได้ยังไงว่า JavaScript มันมี object อะไรบ้าง ใครลูกใคร มี property และ method อะไร