JSON ศุกร์ 13 ฝันหวาน

คนละ JSON ครับ ศุกร์ 13 ฝันหวานนั่นมัน Jason ฆาตกรซอมบี้โรคจิต ถือขวานมั่ง มีดมั่ง บางทีก็เลื่อยไฟฟ้าไปไล่ฆ่าคน ผมกำลังหมายถึง JSON ที่ย่อมาจาก JavaScript Object Notation ครับ

JSON ในที่นี้ หมายถึง รูปแบบของข้อมูล คนอ่านออก คอมพิวเตอร์ก็อ่านออก อยู่ในรูปของ Object หรือ Array ข้อดีของมันคือ เมื่อมันอยู่ในรูปของ Object แล้ว แน่นอน มันส่งค่าประเภทฟังก์ชั่นมาด้วยได้ (โอ้ว ดีจริง ๆ)

ยกตัวอย่างค่าของ JSON ครับ

{
  "name": "chonla",
  "position": "คนสวน",
  "birthday": {
    "date": 1,
    "month": 1,
    "year": 1970
  }
}

การนำไปใช้งานก็แสนง่ายดายครับ มีหลายวิีธีให้เลือก เช่น ผมยกตัวอย่างให้ตัวแปร contact เก็บค่า string ด้านบน เมื่อผมต้องการทำให้มันเป็น JSON object ก็เพียงแค่สั่ง eval() มันครับ

var c1 = eval("(" + contact + ")"); // แบบนี้ก็ได้
eval("var c2 = " + contact + ";");  // แบบนี้ก็ยังได้เลยครับ

การเอา JSON ไปใช้กับ Ajax

เดิมที Ajax จะใช้กับ XML (ตามชื่อมันเลยครับ) หลัง ๆ ไม่ได้มีใช้แค่ XML แล้วครับ ยังมีทั้ง JSON, Text, HTML หรือ Data ในรูปแบบอื่น ๆ อีก การรับค่า XML นั้น ปกติเราก็จะดึงจาก responseXML ของ XML Object แต่ JSON มีค่าเป็น string ธรรมดา ก็ให้ดึงจาก responseText แทนครับ แล้วก็นำไป eval() เพื่อให้ได้เป็น Object ได้เลยครับ

การเอา JSON ไปใช้กับ jQuery

ยิ่งง่ายใหญ่ ใน $.post() ใน jQuery เวอร์ชั่นใหม่ ๆ ได้เพิ่ม parameter ตัวสุดท้ายมาให้เพื่อกำหนดชนิดของข้อมูลที่จะรับกลับมา เราก็แค่กำหนด “json” ให้มัน ค่าที่ได้ก็จะกลับมาเป็น Object สำเร็จรูปเลยครับ

$.post("save.php", {name:"john"}, save_complete, "json");
function save_complete(json)
{
    alert(json.code);
}

ง่ายใช่มั๊ยล่ะครับ งั้นไปดู LIVE DEMO กันครับ

แหล่งอ้างอิงเพิ่มเติม

• http://en.wikipedia.org/wiki/JSON
• http://www.json.org/