jsondatajavascriptMenengah4 mnt baca

JSON: Format Data yang Dipakai Hampir Semua API

Menguasai sintaks JSON, tipe datanya, dan cara mengubah objek JavaScript menjadi JSON dan sebaliknya dengan stringify dan parse.

Kenapa JSON menang?

Dulu API memakai XML yang bertele-tele. Lalu datang JSON (JavaScript Object Notation): ringan, mudah dibaca manusia, dan nyambung alami dengan JavaScript. Sekarang hampir semua API publik berbicara JSON. Contoh respons API yang wajar:

json
{
  "id": 42,
  "judul": "Belajar HTTP",
  "penulis": { "nama": "OmniDev", "kota": "Bandung" },
  "tags": ["http", "api", "pemula"],
  "published": true,
  "rating": 4.8
}

Aturan main JSON

JSON terlihat seperti objek JavaScript, tapi aturannya lebih ketat:

  • Kunci wajib string berpetik dua: { "nama": "Budi" }, bukan { nama: "Budi" }.
  • Nilai boleh berupa string, number, boolean, null, array, atau objek.
  • Tidak ada komentar, fungsi, atau undefined.
  • Koma terakhir (trailing comma) tidak boleh ada.

Satu koma nyasar saja membuat seluruh JSON tidak valid, dan server akan menolaknya dengan 400 Bad Request. Untungnya editor modern menandai kesalahan ini otomatis.

JSON bukan objek JavaScript

Meski mirip, jangan samakan keduanya. Ini jebakan yang sering bikin bingung:

javascript
// Ini OBJEK JavaScript, valid di kode:
const obj = { nama: 'Budi', umur: 17, pensiun: undefined, sapa: function() {} };

// Ini JSON, valid sebagai string data:
const json = '{"nama": "Budi", "umur": 17}';

Perbedaannya: objek JavaScript boleh pakai petik satu, boleh ada fungsi, boleh ada undefined, dan boleh ada trailing comma. JSON tidak boleh satupun dari itu. Konsekuensinya: JSON.stringify akan membuang diam-diam fungsi dan undefined, serta mengubah Date menjadi string. Kalau kamu heran kenapa field tertentu hilang setelah dikirim ke API, kemungkinan besar ini penyebabnya.

stringify dan parse: dua jurus wajib

Di JavaScript kamu terus-menerus mengubah objek menjadi string JSON (untuk dikirim) dan sebaliknya (saat menerima):

javascript
const user = { nama: "Budi", umur: 17, hobi: ["ngoding", "game"] };

// objek -> string JSON (siap dikirim sebagai body)
const jsonString = JSON.stringify(user);
console.log(jsonString);
// {"nama":"Budi","umur":17,"hobi":["ngoding","game"]}

// string JSON -> objek (setelah diterima dari API)
const kembali = JSON.parse(jsonString);
console.log(kembali.nama); // "Budi"

// pretty print untuk debugging, indent 2 spasi
console.log(JSON.stringify(user, null, 2));

JSON.parse akan melempar error kalau string-nya bukan JSON valid. Saat mengambil data dari API yang tidak kamu kontrol, bungkus dengan try/catch agar aplikasimu tidak crash gara-gara satu respons rusak.

Catatan teknis: JSON tidak punya tipe khusus untuk tanggal, jadi API biasanya mengirim tanggal sebagai string format ISO 8601 seperti "2026-10-08T09:30:00Z". Ubah sendiri menjadi objek Date di frontend. Hati-hati juga dengan angka yang sangat besar: JSON number berbasis floating point, jadi ID berupa angka 19 digit bisa kehilangan presisi. API yang rapi mengirim ID besar sebagai string.