Pemformat JSON: Memperindah & Memvalidasi JSON Daring Gratis
Format JSON yang dimampatkan secara instan dengan indentasi yang tepat. Pemformat JSON daring gratis memvalidasi sintaks, memperindah kode, dan mempercepat proses debugging. Bekerja di dalam browser dengan pemformatan waktu nyata.
Pemformat JSON
Format dan perindah JSON Anda dengan alat sederhana ini - pemformatan terjadi secara otomatis saat Anda mengetik!
JSON terformat akan muncul di sini secara otomatis...
Dokumentasi
Apa itu pemformat JSON?
Pemformat JSON adalah alat yang mengambil teks JSON (JavaScript Object Notation) lalu menulis ulang teks tersebut dengan indentasi dan jeda baris, tanpa mengubah datanya. JSON adalah format teks biasa untuk menyimpan dan mengirim data terstruktur, yang dibangun dari pasangan nama/nilai dan daftar. Program biasanya menghemat ruang dengan menghapus semua spasi kosong tambahan, sehingga menghasilkan satu baris padat yang sulit dibaca manusia. Pemformat, yang juga disebut beautifier atau pretty printer, menambahkan kembali spasi kosong tersebut secara konsisten agar strukturnya terlihat. Alat ini memformat JSON secara otomatis saat teks diketik atau ditempel. Tidak ada tombol format; hasilnya diperbarui pada setiap penekanan tombol. Tombol reset menghapus input, dan tombol salin menyalin hasil yang telah diformat.
Aturan sintaks JSON
JSON ditetapkan oleh spesifikasi bernama RFC 8259. JSON memiliki dua jenis wadah:
Objek menyimpan pasangan nama/nilai di dalam kurung kurawal:
1{"name": "John", "age": 30, "city": "New York"}
2Array menyimpan daftar berurutan di dalam kurung siku:
1["apple", "banana", "cherry"]
2Nilai dalam JSON harus merupakan salah satu dari enam jenis: string, angka, boolean (true atau false), null, objek, atau array.
Beberapa aturan menyebabkan sebagian besar kesalahan:
- Nama properti harus diapit tanda kutip ganda.
{name: "John"}tidak valid; bentuk yang benar adalah{"name": "John"}. - String harus menggunakan tanda kutip ganda, bukan tanda kutip tunggal.
- Koma tidak boleh mengikuti item terakhir dalam objek atau array (tidak boleh ada koma penutup).
- JSON tidak memiliki sintaks komentar, meskipun tampilannya yang menggunakan kurung kurawal dan kurung siku berasal dari JavaScript.
- JSON tidak memiliki
undefined. Gunakannulluntuk nilai yang tidak ada.
Kesalahan yang umum terjadi adalah menempelkan literal objek JavaScript, bukan JSON. {name: 'John', age: undefined} valid dalam JavaScript, tetapi tidak valid dalam JSON. Versi JSON-nya adalah {"name": "John", "age": null}.
Cara kerja pemformat JSON ini
Banyak pemformat JSON meneruskan teks ke JSON.parse() untuk membangun objek JavaScript, lalu menjalankan JSON.stringify() untuk mengubahnya kembali menjadi teks dengan spasi. Proses bolak-balik ini memiliki efek samping: angka JavaScript berupa float presisi ganda IEEE 754, yang tidak dapat merepresentasikan setiap bilangan bulat secara tepat setelah melewati 2^53 − 1 (9,007,199,254,740,991). ID seperti 9007199254740993 dapat berubah menjadi 9007199254740992 setelah proses tersebut.
Alat ini menghindari langkah tersebut. Alat ini membaca input karakter demi karakter dengan parser kecil yang ditulis secara manual, dan alih-alih mengonversi setiap angka atau string menjadi nilai JavaScript, alat ini menyalin bagian teks tersebut persis seperti yang ditulis, lalu menempatkannya pada tingkat indentasi yang benar. Karena angka tidak pernah dikonversi menjadi float, bilangan bulat dengan ukuran apa pun mempertahankan digit persisnya. Jika sebuah objek memiliki kunci yang sama lebih dari satu kali, kedua salinannya tetap dipertahankan di tempatnya, bukan digabungkan menjadi salinan terakhir seperti yang terjadi saat membangun objek JavaScript.
Prosesnya, langkah demi langkah:
- Baca token berikutnya (objek, array, string, angka,
true,false, ataunull). - Periksa token tersebut berdasarkan tata bahasa JSON. Tolak token jika melanggar aturan, misalnya memiliki kunci tanpa tanda kutip atau koma penutup.
- Salin teks token tanpa perubahan ke dalam output.
- Tambahkan jeda baris dan indentasikan dengan 2 spasi untuk setiap tingkat penyarangan di dalam objek atau array. Objek atau array yang kosong tetap berada pada satu baris, seperti
{}atau[]. - Ulangi sampai seluruh input selesai dibaca.
Indentasi ditetapkan sebesar 2 spasi; tidak ada pengaturan untuk mengubahnya. Saat kotak input kosong, panel output menampilkan teks placeholder "Formatted JSON will appear here automatically...". Jika input melanggar aturan JSON, alat menampilkan pesan "Invalid JSON: Please check your input", bukan pesan parser teknis dengan posisi karakter yang tepat. Sebaliknya, JSON.parse() bawaan browser memang melaporkan posisi karakter dalam teks kesalahannya.
Contoh perhitungan
Input yang diperkecil ini:
1{"name":"John Doe","age":30,"address":{"street":"123 Main St","city":"Anytown","state":"CA"},"hobbies":["reading","hiking","photography"]}
2menjadi:
1{
2 "name": "John Doe",
3 "age": 30,
4 "address": {
5 "street": "123 Main St",
6 "city": "Anytown",
7 "state": "CA"
8 },
9 "hobbies": [
10 "reading",
11 "hiking",
12 "photography"
13 ]
14}
15Setiap objek atau array bersarang diindentasi satu tingkat lebih jauh daripada induknya, sehingga hubungan antara address dan ketiga bidangnya dapat terlihat sekilas.
Contoh kedua menunjukkan alasan pentingnya menyalin literal. Input ini:
1{"id":9007199254740993}
2diformat menjadi:
1{
2 "id": 9007199254740993
3}
4Digitnya tetap persis seperti yang diketik. Pemformat yang dibangun berdasarkan JSON.parse() lalu JSON.stringify() akan mengubah angka tersebut secara diam-diam menjadi 9007199254740992.
Kesalahan JSON yang umum
- Nama properti tanpa tanda kutip:
{name: "John"}. Perbaikan:{"name": "John"}. - Koma penutup:
{"age": 30,}. Perbaikan: hapus koma sebelum kurung kurawal penutup. - Kurung tidak cocok:
{"data": [1, 2}. Perbaikan: tutup array dengan]sebelum menutup objek. - String tidak ditutup:
{"name": "John}. Perbaikan: tambahkan tanda kutip penutup yang hilang. - Tanda kutip tunggal:
{'name': 'John'}. Perbaikan: gunakan tanda kutip ganda. undefined,NaN, atauInfinity: tidak satu pun merupakan nilai JSON yang valid. Gunakannullatau string.
Sumber yang sering menyebabkan kesalahan ini adalah penyalinan objek langsung dari konsol browser atau log server, yang sering menyertakan sintaks khusus JavaScript dan harus dibersihkan sebelum menjadi JSON yang valid.
Kapan menggunakan pemformat JSON
Pemformat JSON paling sering digunakan untuk memeriksa respons API, yang biasanya dikirim dalam bentuk diperkecil untuk menghemat bandwidth. Alat ini juga digunakan untuk memeriksa berkas konfigurasi seperti package.json atau composer.json secara manual, membaca data yang disalin dari penyimpanan lokal atau konsol browser, dan memahami bentuk dataset yang diterima dari sistem lain.
Cara lain untuk memformat JSON
- Alat pengembang browser: Chrome, Edge, dan Firefox secara otomatis memformat respons JSON di panel pratinjau tab Network.
- Editor kode: Visual Studio Code memformat berkas JSON yang terbuka dengan Alt+Shift+F (Shift+Option+F di Mac). Sebagian besar editor memiliki pintasan yang setara atau ekstensi pemformatan.
- Baris perintah:
jq(jq . file.json) danpython -m json.tool file.jsonbawaan Python sama-sama memformat JSON dari terminal.
Memasukkan pemformatan JSON ke dalam kode
Sebagian besar bahasa pemrograman menyertakan pustaka JSON dengan opsi indentasi. Dalam JavaScript:
1const formatted = JSON.stringify(JSON.parse(rawJson), null, 2);
2Dalam Python:
1import json
2formatted = json.dumps(json.loads(raw_json), indent=2)
3Kedua pendekatan tersebut mengurai teks menjadi struktur data asli, lalu membuat serialisasinya kembali dengan spasi. Cara ini mudah ditulis, tetapi dapat mengubah angka. JavaScript menyimpan setiap angka sebagai double, sehingga 9007199254740993 akan kembali sebagai 9007199254740992. Python mempertahankan bilangan bulat secara tepat karena bilangan bulat Python tidak memiliki batas ukuran, tetapi Python tetap menulis ulang 1.0e2 menjadi 100.0 dan mengubah 1e999 menjadi Infinity, yang tidak valid dalam JSON. Aplikasi yang memerlukan bilangan bulat besar secara tepat, seperti ID basis data, sering menyimpannya sebagai string dalam JSON, bukan sebagai angka.
Sejarah singkat JSON
Douglas Crockford menetapkan JSON pada awal tahun 2000-an, dengan mengambil sintaksnya dari literal objek JavaScript tetapi membuatnya dapat digunakan dari bahasa apa pun. RFC 4627 meresmikannya pada 2006. JSON menyebar dengan cepat karena lebih singkat untuk ditulis daripada XML dan dapat dipetakan langsung ke objek JavaScript, hal yang penting ketika aplikasi web mulai mengambil data di latar belakang, bukan memuat ulang seluruh halaman. Pada tahun 2010-an, JSON telah menjadi format baku untuk API REST dan basis data seperti MongoDB.
Pertanyaan yang sering diajukan
Apa itu pemformat JSON? Alat yang menambahkan indentasi, jeda baris, dan spasi ke teks JSON agar strukturnya mudah dibaca, tanpa mengubah datanya.
Apakah pemformatan mengubah data? Tidak. Pemformatan hanya mengubah spasi kosong. Alat ini menyalin setiap string dan angka persis seperti yang diketik, sehingga nilai dalam output yang diformat sama persis dengan input, termasuk angka yang terlalu besar untuk disimpan secara tepat sebagai angka JavaScript.
Mengapa saya mendapatkan kesalahan "Invalid JSON"? Input melanggar aturan JSON. Penyebab umum meliputi nama properti tanpa tanda kutip, koma penutup, tanda kutip tunggal, string yang tidak ditutup, atau kurung yang tidak cocok. Alat ini tidak menampilkan posisi karakter masalah secara tepat; memeriksa input berdasarkan aturan di atas biasanya dapat menemukannya dengan cepat.
Bisakah JSON memiliki komentar? Tidak. Spesifikasinya tidak mengizinkan komentar. Format seperti JSONC dan JSON5 menambahkan dukungan komentar di atas sintaks JSON untuk kasus yang memerlukannya, seperti berkas konfigurasi.
Berapa indentasi JSON standar? Dua spasi adalah konvensi yang paling umum dalam pengembangan web dan digunakan oleh alat ini. Sebagian panduan gaya menggunakan empat spasi atau tab; spesifikasi JSON sendiri tidak mewajibkan indentasi tertentu.
Apa perbedaan antara JSON.parse() dan JSON.stringify()?
JSON.parse() mengubah string JSON menjadi nilai JavaScript. JSON.stringify() melakukan kebalikannya, yaitu mengubah nilai JavaScript menjadi string JSON, dan menerima argumen indentasi untuk pencetakan yang rapi. Alat ini tidak menggunakan fungsi mana pun secara internal, sehingga dapat mempertahankan bilangan bulat besar secara tepat.