Cara bermain JSON Bengkel
- Baca instruksi level. Empat level pertama minta kamu memperbaiki teks JSON, sisanya menulis kode JavaScript.
- Di level perbaikan, sunting teks JSON-nya langsung. Selama masih rusak, panel kanan menunjuk baris dan kolom error beserta penyebabnya. Begitu sah, isinya tampil sebagai pohon.
- Di level kode, tulis isi fungsi
servis(). Variabelnya tampil sebagai pohon yang bisa dilipat, dan bagian data yang dibahas disorot. - Tekan Cek jawaban atau Ctrl + Enter. Yang dicek adalah nilai hasilnya. Kode dijalankan di dua pesanan dengan data berbeda, jadi menulis jawabannya langsung tidak akan lolos.
- Kalau buntu, buka Petunjuk. Petunjuk pertama mengarahkan, petunjuk terakhir hampir menjawab.
- Level yang sudah selesai tetap tercentang saat kamu kembali dengan browser yang sama.
Yang kamu pelajari
- Level 1
Koma di akhir
Item terakhir objek atau array JSON tidak boleh diikuti koma, walaupun JavaScript membolehkannya.
- Level 2
Kutip ganda
Teks dan key JSON wajib memakai kutip ganda
". - Level 3
Key berkutip
Setiap key objek JSON ditulis sebagai teks,
"kurir": "JNE". - Level 4
Tanpa komentar
JSON tidak punya komentar. Catatan disimpan sebagai field biasa.
- Level 5
JSON.parse
Mengubah teks JSON jadi objek yang bisa dibaca field-nya.
- Level 6
Akses bersarang
Titik untuk field objek, kurung siku untuk indeks array:
servis[1].part[0]. - Level 7
Optional chaining dan ??
alamat?.kotatidak error kalaualamattidak ada, dan??memberi nilai cadangan. - Level 8
Indentasi JSON.stringify
Argumen ketiga mengatur indentasi, mis.
JSON.stringify(nota, null, 2). - Level 9
Replacer
Fungsi
(key, value)di argumen keduaJSON.stringify. Mengembalikanundefinedmembuang field itu. - Level 10
Reviver
Fungsi
(key, value)di argumen keduaJSON.parse, misalnya untuk mengubah teks tanggal jadiDate. - Level 11
structuredClone
Menyalin objek sampai ke dalam, termasuk
Date, tanpa berbagi objek dengan aslinya.
JSON bukan objek JavaScript
JSON adalah format teks. Sintaksnya mirip objek JavaScript, tapi lebih ketat: key dan teks wajib berkutip ganda, tidak ada koma di akhir, tidak ada komentar, dan tidak ada undefined, fungsi, atau Date.
Respons dari fetch atau localStorage selalu teks. Kamu baru bisa menulis data.pelanggan.nama setelah teks itu diubah dengan JSON.parse. Sebaliknya, JSON.stringify mengubah objek jadi teks, dan Date di dalamnya ikut jadi teks.
Tanya jawab
Apakah harus daftar akun untuk bermain?
Tidak. Semua level bisa dimainkan tanpa akun. Kemajuanmu disimpan di browser yang kamu pakai, jadi akan hilang kalau data browser dihapus.
Di mana kodeku dijalankan?
Kode JavaScript di level 5 sampai 11 dijalankan di Web Worker di dalam iframe terpisah, bukan di halaman ini. Teks JSON di level 1 sampai 4 hanya diurai sebagai data, tidak dijalankan.
Kenapa pesan errornya beda dengan pesan JSON.parse di browserku?
Pesan JSON.parse berbeda di tiap browser. Game ini memakai pengurai sendiri yang sama ketatnya, lalu menyebut penyebab yang paling mungkin, misalnya koma di akhir atau kutip tunggal.
Kenapa JSON.parse(JSON.stringify(obj)) tidak lolos di level terakhir?
Cara itu memang menyalin sampai ke dalam, tapi semua Date berubah jadi teks, dan field berisi undefined atau fungsi hilang. structuredClone menjaga Date, Map, dan Set tetap utuh.
Kenapa replacer berupa array tidak cukup untuk menyembunyikan telepon?
Replacer array adalah daftar key yang boleh lewat, dan daftar itu berlaku di semua tingkat. Key nama di dalam pelanggan ikut terbuang kalau tidak ditulis. Fungsi replacer lebih tepat untuk membuang satu key di mana pun letaknya.