Sunday, August 11, 2013

มารู้จัก JSON กันเถอะ

อะไรคือ JSON ?

JSON ย่อมาจาก JavaScript Object Notation เป็นโครงสร้างในการเก็บข้อมูลชนิดนึง นอกเหนือจาก XML ด้วยเหตุที่ว่ามีความรวดเร็ว และเข้าใจง่ายกว่า XML เป็นอย่างมาก ส่วนใหญ่นำมาใช้ในการทำ AJAX เพื่อทำให้สามารถรับส่งค่า หรือสั่งการเข้า Server พร้อมกับชุดข้อมูลขนาดใหญ่ได้ ภาษาโปรแกรมมิ่งที่ปัจจุบันยังนิยมอยู่เช่น Java และ PHP (พอดีว่ายังไม่ได้จับภาษาอื่นจริงๆจังๆ เลยจะเน้น สอง ภาษานี้เป็นหลัก แต่ส่วนใหญ่คงเป็น PHP เพราะมีความเข้าใจง่ายกว่า และคนรู้จัก และเข้าใจเยอะ) มีตัวช่วยให้ใช้หลากหลาย เช่น ของ Java มี GSON ที่ทำให้ JSON กลายเป็นเรื่อง่ายไปเลย หรือของ PHP ก็มีตัว encode_json เป็นของตัวเองอยู่แล้ว JSON ยังมีชนิดไฟล์เป็นของตัวเอง (เหมือน XML) คือ .json

JSON มันดีกว่า XML ยังไงละ

คิดว่าหลายๆ คนคงเคยได้ลองใช้ XML หรือ JSON กันมาบ้างแล้ว แต่ว่า มันดีกว่าอย่างไรละ ? ทำไมผมถึงเกริ่นซะมันดีโคตรๆ ไปเลย (ก็แหงหละ พูดถึง JSON หนิ ถ้าพูดถึง XML ก็คงอวย XML......คิดว่านะ)

  • JSON เป็นอะไรที่เข้าใจง่ายๆ คนที่ไม่รู้ก็ยังพอเข้าใจได้ ไม่เหมือน XML ที่มันดูซับซ้อน
  • JSON ไม่จำเป็นต้องใช้ tag เปิดปิดให้ยุ่งยาก
  • JSON มีการเก็บข้อมูลแบบลำดับชั้น (Hierarchical)
  • JSON สามารถส่งค่าผ่านทาง JavaScript ได้
  • JSON สั้น กระชับกว่า และสามารถถูกอ่านหรือเขียนได้เร็วกว่า
  • JSON ไม่มีจำกัดคำเฉพาะ (เช่นพวก public, private, etc.)
  • JSON สามารถเก็บค่าแบบ Array ได้

Syntax

JSON มีลักษณะการเก็บคล้ายๆ Array ที่มี key คือ ใช้ String เป็นชื่อตัวแปร และขั้นด้วย ":" เพื่อใส่ ข้อมูล สำหรับการแยกค่าจะใช้ "," ในการแบ่งออกไป ส่วน "{}"เป็นการแสดงถึง object ในแต่ล่ะชั้น {"id":1,"name":"Cail","lastname":"Potato"},{"id":2,"color":"green","fruit":"Tomato"} ซึ่งจะเห็นว่า ถ้ามี double quotes หรือจะใช้ single quote ก็ได้ (แต่ควรใช้ double quotes)ครอบจะเป็น String อยู่แล้ว แต่ถ้าหากว่าเป็น พวก Integer หรือ ตัวเลข จะไม่จำเป็นต้องมี

สำหรับ Array นั่น จะใช้ "[]" ในการเก็บค่า {"gods":["Jupiter","Minerva","Ceres","Mars"]}

JSON + HTML(JavaScript)

ตัวอย่างวิธีการนำ JSON ที่อยุ่ใน String(JavaScript) มาใช้

Links : simple_json.html

JSON + HTML(JavaScript) - File

การนำไฟล์ JSON เข้ามาใช้
Links : json_with_file.html

Links : json.json

JSON + HTML(JavaScript) + PHP

การนำมาใช้คู่กับ PHP

Links : json_in_use.html

No comments:

Post a Comment