JSON คืออะไร? คู่มือฟอร์แมตข้อมูลยอดนิยม

JSON คืออะไร? คู่มือฟอร์แมตข้อมูลยอดนิยม

JSON (JavaScript Object Notation) คือฟอร์แมตแลกเปลี่ยนข้อมูลที่อ่านง่ายทั้งคนและเครื่อง — เป็นมาตรฐานหลักของ API สมัยใหม่

โครงสร้างพื้นฐาน

{
  "name": "ThaiTools",
  "tools": 53,
  "free": true
}
  • ข้อมูลเป็นคู่ key: value
  • key ต้องอยู่ในเครื่องหมายคำพูดคู่
  • รองรับ string, number, boolean, array, object, null

ข้อผิดพลาดที่พบบ่อย

  • เครื่องหมายจุลภาคเกิน (trailing comma) — JSON ไม่ยอม
  • key ไม่มีเครื่องหมายคำพูด
  • วงเล็บปีกกาไม่สมดุล

วิธีเช็คว่า JSON ถูกต้อง

  1. ใช้ เครื่องจัดรูปแบบ JSON ของเรา — beautify + ตรวจ error พร้อมบอกตำแหน่งที่ผิด
  2. หรือเช็คผ่าน console ของเบราว์เซอร์ (JSON.parse)

ทำไม JSON ถึงฮิต

  • อ่านง่ายกว่าพวก XML
  • ทุกภาษาโปรแกรมรองรับ
  • เบาและเร็ว

จัดรูปแบบอัตโนมัติ

ใช้ เครื่องจัดรูปแบบและตรวจสอบ JSON — beautify/minify + ตรวจสอบ ฟรี

JSON vs XML: เปรียบเทียบแบบเห็นภาพ

ก่อน JSON จะบูม ทีมงาน Webpanna Studio สมัยทำเว็บระบบหลังบ้านให้ร้านอาหารหลายที่ยังต้องจัดการกับ XML อยู่เยอะ พอลองเทียบกันแบบเดียวกันจะเห็นความต่างชัดเจน — เขียนรายการเมนู 3 รายการด้วย XML ต้องใช้ tag เปิด-ปิดคู่กันทุกชั้น แต่ JSON ใช้แค่วงเล็บกับเครื่องหมายคำพูด

ประเด็นJSONXML
ขนาดไฟล์ (เมนู 3 รายการ)~150 ไบต์~300+ ไบต์
อ่านด้วยตาเปล่าง่าย โครงชัดต้องไล่ tag เยอะ
การแทรกเว้นวรรค/คอมเมนต์ไม่รองรับคอมเมนต์รองรับ
ตัวเลขเป็น number จริง คำนวณต่อได้เป็นข้อความ ต้องแปลงก่อน
รองรับใน JavaScriptเป็นพื้นเมือง แปลงทันทีต้องใช้ parser เพิ่ม

ประเด็นตัวเลขสำคัญกว่าที่คิด — ใน XML ถ้าเขียน <price>45</price> ค่าที่ได้คือ string ต้องแปลงเป็นตัวเลขก่อนคิดเงิน แต่ JSON เก็บเป็น 45 ได้เลย

ตัวอย่างการใช้งานจริงในบริบทไทย: คำนวณเมนูอาหาร

เราใช้ JSON เก็บข้อมูลเมนูกันบ่อยมาก ลองดูตัวอย่างที่คำนวณราคาจริง เช่น สินค้าที่ตั้งราคาเป็นจำนวนเงินแบบไทย:

รายการราคา (บาท)จำนวนรวม (บาท)
ผัดไทยกุ้ง602120
ต้มยำกุ้ง1201120
น้ำมะนาว25375
รวมทั้งหมด315

ใน JSON จะเก็บเป็น "price": 60 (number ไม่ใส่คำพูด) แล้วโค้ดสามารถนำไปคูณจำนวนและบวกรวมได้ทันที ส่วนการแสดงผลเป็นเงินบาท มักจัดรูปแบบด้วยฟังก์ชันของภาษานั้น ๆ เช่น ให้แสดงเป็น ฿315 หรือคั่นหลักเป็น 1,250.50 ตอนยอดเกินพัน ข้อควรระวังที่เจอบ่อยคือคนเก็บราคาเป็น string "60" แล้วเอามาคำนวณตรง ๆ ผลคือได้ "602" แทนที่จะเป็น 62 (ตัวอย่าง “60” + “2”) — ดังนั้นตัวเลขที่ต้องเอาไปคำนวณ ให้เก็บเป็น number เสมอ

มุมทีมงาน: บทเรียนที่เราเรียนรู้จากการส่งมอบงาน

พูดตรง ๆ ว่า JSON ที่ “ดูถูก” กับ JSON ที่ “ใช้ได้จริง” ต่างกันมาก ช่วงหลัง ๆ ที่เราทำระบบหลังบ้านสำหรับ SME ที่มีข้อมูลภาษาไทย สิ่งแรกที่เราย้ำกับทีมคือเรื่องการเข้ารหัสตัวอักษร — JSON มาตรฐานต้องเป็น UTF-8 เท่านั้น ถ้าไฟล์ถูกเซฟเป็น encoding อื่น ชื่อเมนูอย่าง “ข้าวผัดกระเพรา” จะกลายเป็นตัวอักษรเพี้ยน ๆ ทันที อีกจุดคือเรื่องตัวเลขทศนิยม อย่าเก็บราคาเป็น 12.0 ปนกับ 12.50 แบบไม่มีมาตรฐาน เพราะเวลาไปแสดงบนบิลหรือเชื่อมกับระบบบัญชีจะเพี้ยนได้ สุดท้ายคือเรื่องการตั้งชื่อ key — ตกลงรูปแบบเดียวตั้งแต่ต้น เช่น ใช้ snake_case ทั้งโปรเจกต์ (order_total, customer_name) จะช่วยให้ทีมที่มาต่อภายหลังอ่านโครงสร้างได้ในไม่กี่นาที สามข้อนี้ฟังดูเล็ก แต่ช่วยลดงานแก้ไขภายหลังได้จริง

ข้อผิดพลาดระดับสูงขึ้นที่ควรรู้

นอกจาก trailing comma และ key ไม่มีเครื่องหมายคำพูดแล้ว ยังมีจุดที่คนพลาดบ่อย:

  • ใช้เครื่องหมายคำพูดเดี่ยว — "name": 'ThaiTools' ผิด ต้องเป็นเครื่องหมายคู่ทั้ง key และ string
  • มีคอมเมนต์ในไฟล์ — JSON มาตรฐานไม่รองรับ // หรือ /* */
  • ค่าที่ไม่รู้จัก — เช่น undefined หรือ NaN ไม่ใช่ค่าที่ถูกต้อง ให้ใช้ null แทน
  • ตัวเลขนำหน้าด้วยศูนย์ — 007 ไม่ถูกต้องตามมาตรฐาน

ถ้าไฟล์ใหญ่และหาจุดผิดไม่เจอ ลองวางเข้าเครื่องมือตรวจสอบที่บอกบรรทัดและคอลัมน์ของ error จะเร็วกว่าไล่ตาด้วยตาเปล่ามาก

คำถามที่พบบ่อย (Q&A)

JSON กับ JavaScript ต้องใช้คู่กันไหม?

ไม่จำเป็น ชื่อมาจาก JavaScript Object Notation เพราะไวยากรณ์คล้ายกัน แต่ตอนนี้ทุกภาษา ไม่ว่า PHP, Python, Java หรือ Go ล้วนมีไลบรารีอ่าน-เขียน JSON ในตัว เราเขียนงานหลายภาษาและใช้ JSON สื่อสารข้ามภาษาได้สบาย

JSON ยังใช้ต่อไปได้อีกนานไหม ในเมื่อมีฟอร์แมตใหม่ ๆ อย่าง YAML?

ยังแน่นหนามาก เพราะเป็นมาตรฐานหลักของ API เกือบทั้งหมด YAML ใช้เยอะในฝั่งไฟล์ config เพราะเขียนสั้นกว่า แต่เวลาส่งข้อมูลระหว่างระบบ JSON ยังคือคำตอบแรก ๆ ของเก