Cara melihat JSON dalam bentuk tree
- Tempel JSON, seret file, atau muat dari URL. Tree muncul di sebelah teks.
- Klik sebuah baris untuk membuka atau menutupnya, atau gunakan Buka semua dan Tutup semua. Dengan keyboard, ↑ dan ↓ untuk berpindah, ← dan → untuk menutup dan membuka node.
- Ketik di kotak pencarian untuk menampilkan key dan nilai yang cocok saja. Pilih node untuk menyalin JSONPath, path JavaScript, atau nilainya.
Cara membaca tree JSON
- Objek menampilkan jumlah key-nya, misalnya
{5}, dan array menampilkan jumlah item-nya, misalnya[12]. - Warna dan badge kecil menunjukkan tipe setiap nilai: string, angka, boolean, null, objek, atau array.
- Array panjang ditampilkan 200 item sekaligus, sehingga file dengan ratusan ribu nilai tetap responsif.
- Angka ditampilkan persis seperti yang ditulis – ID panjang tidak dibulatkan, dan key tetap dalam urutan aslinya.
Apa itu JSONPath?
JSONPath menjelaskan letak sebuah nilai di dalam dokumen JSON, mirip seperti path file. JSONPath distandarkan pada 2024 sebagai RFC 9535. $ adalah root, .name memilih properti, [0] memilih item array, dan ['first name'] memilih properti yang namanya mengandung spasi atau karakter khusus.
| Path | Memilih |
|---|---|
$.store | properti store dari objek root |
$.products[0] | item pertama dari array products |
$.products[0].price | harga produk pertama tersebut |
$.address.geo.lat | nilai yang bersarang tiga level di dalam |
$['shipping address'].city | key dengan spasi di namanya |
Di JavaScript, nilai yang sama ditulis data.products[0].price – gunakan Salin path JS untuk mendapatkan bentuk tersebut.
Pertanyaan yang sering diajukan
Bisakah saya membuka file JSON yang besar?
Bisa. Hanya bagian tree yang dibuka yang digambar dan array panjang ditampilkan 200 item sekaligus, sehingga file berukuran puluhan megabyte bisa dibuka di browser desktop.
Bagaimana cara menyalin path sebuah nilai?
Klik node-nya, lalu gunakan Salin path untuk JSONPath ($.users[0].email) atau Salin path JS untuk JavaScript (data.users[0].email).
Bisakah saya mengedit JSON di viewer?
Viewer ini hanya untuk membaca (read-only), sehingga tidak ada yang berubah secara tidak sengaja. Untuk mengubah nilai, mengganti nama key, atau menambahkan item, buka Editor JSON.
Apa yang terjadi jika JSON saya tidak valid?
Kotak error menampilkan baris, kolom, dan penyebab masalahnya, dan tree tetap menampilkan versi valid terakhir sampai error diperbaiki.