Developer

JSON Formatter & Validator ออนไลน์ฟรี — จัดรูปแบบและแก้ไข JSON ทันที

จัดรูปแบบ ตรวจสอบ และบีบอัด JSON ได้ทันทีในเบราว์เซอร์ของคุณ JSON formatter ฟรี พร้อม syntax highlighting, การตรวจจับข้อผิดพลาด และไม่ต้องสมัครสมาชิก

5 นาทีในการอ่าน

JSON formatter and validator online

JSON ที่ไม่ได้จัดรูปแบบอ่านแทบไม่ออก แค่ลืมจุลภาคเดียวหรือวงเล็บไม่ครบก็พังทั้งหมด JSON formatter ที่ดีแก้ปัญหาทั้งสองอย่างได้ — ช่วยจัดระเบียบ JSON ที่รกรุงรังและตรวจจับข้อผิดพลาดได้ทันที

JSON คืออะไร?

JSON (JavaScript Object Notation) คือรูปแบบข้อมูลที่ใช้กันแพร่หลายที่สุดสำหรับ APIs, ไฟล์ config และการแลกเปลี่ยนข้อมูลระหว่างระบบต่าง ๆ มีหน้าตาแบบนี้:

{
  "name": "John Doe",
  "age": 30,
  "email": "john@example.com",
  "skills": ["JavaScript", "Python", "SQL"]
}

เมื่อ JSON มาจาก API หรือ log file มักจะมีหน้าตาแบบนี้แทน:

{"name":"John Doe","age":30,"email":"john@example.com","skills":["JavaScript","Python","SQL"]}

ทั้งสองมีข้อมูลเหมือนกันทุกประการ แบบแรกอ่านได้ง่าย แบบที่สองต้องใช้ formatter ช่วย

วิธีจัดรูปแบบ JSON ออนไลน์

ใช้งาน JSON Formatter ของเรา:

  1. วาง JSON ลงในช่องข้อความ
  2. formatter จะตรวจจับและแสดงข้อผิดพลาดโดยอัตโนมัติ
  3. คลิก Format เพื่อจัดรูปแบบพร้อมการย่อหน้าที่เหมาะสม
  4. คัดลอกผลลัพธ์หรือดาวน์โหลดเป็นไฟล์ .json

การจัดรูปแบบเกิดขึ้นทันทีและทำงานแบบออฟไลน์ได้หลังจากโหลดหน้าครั้งแรก

การตรวจสอบ JSON — ตรวจจับข้อผิดพลาดอะไรได้บ้าง?

JSON ที่ถูกต้องต้องปฏิบัติตามกฎที่เข้มงวด ข้อผิดพลาดทั่วไปที่ validator ตรวจจับได้:

ข้อผิดพลาด ตัวอย่าง
Trailing comma {"key": "value",}
Single quotes {'key': 'value'}
Unquoted keys {key: "value"}
ขาด comma {"a": 1 "b": 2}
วงเล็บไม่ปิด {"key": [1, 2, 3}
Comments {"key": "value" // comment}

JSON ไม่อนุญาตให้มี trailing commas, single quotes, unquoted keys หรือ comments — นิสัยที่ติดมาจาก JavaScript ซึ่งทำให้การ parse JSON แบบเข้มงวดล้มเหลว

Beautify vs. Minify

Beautify (pretty-print) เพิ่มการย่อหน้าและการขึ้นบรรทัดใหม่เพื่อให้มนุษย์อ่านได้ง่าย ใช้เมื่อต้องการอ่านหรือดีบัก JSON

Minify ลบช่องว่างทั้งหมดเพื่อให้ได้ไฟล์ขนาดเล็กที่สุด ใช้เมื่อส่ง JSON ใน API requests หรือจัดเก็บในที่ที่ขนาดไฟล์มีความสำคัญ

ตัวอย่าง API response ที่ beautify แล้ว:

{
  "status": "success",
  "data": {
    "id": 123,
    "name": "Product Name"
  }
}

Response เดียวกันเมื่อ minify แล้ว:

{"status":"success","data":{"id":123,"name":"Product Name"}}

เวอร์ชัน minify มีขนาดเล็กกว่า 30–50% ขึ้นอยู่กับโครงสร้างข้อมูล

การย่อหน้า JSON: 2 spaces vs. 4 spaces vs. tabs

เป็นเรื่องของสไตล์ส่วนตัว แนวทางที่นิยมใช้กัน:

  • 2 spaces — ค่าเริ่มต้นใน JavaScript, Node.js และโปรเจกต์เว็บส่วนใหญ่
  • 4 spaces — นิยมในโปรเจกต์ Python และ Java
  • Tabs — ใช้ในบางโปรเจกต์เก่าและ Go

formatter ของเราตั้งค่าเริ่มต้นที่ 2 spaces แต่คุณสามารถเลือกได้

การทำงานกับไฟล์ JSON ขนาดใหญ่

ไฟล์ JSON ขนาดใหญ่ (API responses, database exports, log files) อาจมีขนาดหลายร้อยเมกะไบต์ เนื่องจาก formatter ของเรารันทั้งหมดในเบราว์เซอร์ของคุณโดยใช้ JavaScript จึงสามารถจัดการไฟล์ขนาดใหญ่ได้โดยไม่ต้องส่งข้อมูลไปยัง server — สำคัญมากเมื่อข้อมูลมีข้อมูลที่ละเอียดอ่อน

สำหรับไฟล์ขนาดใหญ่มาก (100MB+) ประสิทธิภาพของเบราว์เซอร์ขึ้นอยู่กับหน่วยความจำที่มีในอุปกรณ์

กรณีการใช้งาน JSON ที่พบบ่อย

ดีบัก API responses วางข้อมูล response ดิบจาก Postman, curl หรือแท็บ network ของเบราว์เซอร์ formatter จะแสดงโครงสร้างได้อย่างชัดเจนและไฮไลต์ข้อผิดพลาดในการ parse

อ่านไฟล์ config package.json, tsconfig.json, .eslintrc.json — ไฟล์ config มักถูก minify หรือจัดรูปแบบไม่ดี วางเข้ามาเพื่ออ่านได้ง่ายขึ้น

แก้ไข JSON ที่เสียหาย หากคุณได้รับ JSON ที่มี syntax errors validator จะระบุบรรทัดและตัวอักษรที่ผิดพลาดได้อย่างแม่นยำ เพื่อให้คุณแก้ไขได้รวดเร็ว

แปลงสำหรับเครื่องมืออื่น หลังจากจัดรูปแบบแล้ว คุณสามารถแปลง JSON เป็นรูปแบบอื่นได้โดยใช้ตัวแปลง JSON to CSV หรือ YAML to JSON ของเรา

JSON vs. YAML vs. XML

รูปแบบ ความสะดวกในการอ่าน ความยาวโค้ด กรณีใช้งาน
JSON ดี น้อย APIs, เว็บ, ไฟล์ config
YAML ดีเยี่ยม น้อยมาก ไฟล์ config, DevOps (Docker, Kubernetes)
XML ไม่ดี มาก ระบบเก่า, SOAP APIs, เอกสาร

JSON ได้กลายเป็นค่าเริ่มต้นสำหรับ APIs และไฟล์ config สมัยใหม่ YAML เป็นที่นิยมสำหรับ config ที่มนุษย์แก้ไขเอง ส่วน XML ส่วนใหญ่เป็นระบบเก่าแล้ว

Keyboard shortcuts

ใน JSON Formatter ของเรา:

  • Ctrl + Shift + F — format / beautify
  • Ctrl + Shift + M — minify
  • Ctrl + A — เลือกทั้งหมด
  • Ctrl + C — คัดลอกผลลัพธ์

สรุป

JSON formatter คือหนึ่งในเครื่องมือที่นักพัฒนาใช้บ่อยที่สุดในการทำงาน JSON Formatter ของเรารันในเบราว์เซอร์ของคุณ ทำงานแบบออฟไลน์ได้ รองรับไฟล์ขนาดใหญ่ และตรวจจับ syntax errors ได้ทันที — ไม่ต้องสมัครบัญชี ไม่ต้องอัปโหลด ไม่มีข้อจำกัด