JSON JavaScript: Sintak Code dan Cara Membuatnya

JSON adalah format untuk menyimpan dan mengangkut data.

JSON sering digunakan saat data dikirim dari server ke halaman web.

Section Artikel

1 Apa itu JSON?
2 Contoh JSON
3 Format JSON Dievaluasi ke Object JavaScript
4 Aturan Sintaks JSON
5 Data JSON – Nama dan Nilai
6 Object JSON
7 Array JSON
8 Mengonversi Teks JSON menjadi Object JavaScript

Apa itu JSON?

JSON adalah singkatan dari JavaScript Object Notation
JSON adalah format pertukaran data ringan
JSON tidak bergantung pada bahasa *
JSON “mendeskripsikan diri sendiri” dan mudah dimengerti

Sintaks JSON diturunkan dari sintaks notasi object JavaScript, tetapi format JSON hanya teks. Kode untuk membaca dan menghasilkan data JSON dapat ditulis dalam bahasa pemrograman apa pun.

Contoh JSON

Sintaks JSON ini mendefinisikan object employee: array 3 record employee (object).

Contoh:

{
"employees":[
  {"firstName":"John", "lastName":"Doe"},
  {"firstName":"Anna", "lastName":"Smith"},
  {"firstName":"Peter", "lastName":"Jones"}
]
}

Format JSON Dievaluasi ke Object JavaScript

Format JSON secara sintaksis identik dengan kode untuk membuat object JavaScript.

Karena kemiripan ini, program JavaScript dapat dengan mudah mengubah data JSON menjadi object JavaScript asli.

Aturan Sintaks JSON

Data dalam pasangan nama / nilai
Data dipisahkan dengan koma
Tanda kurung kurawal menampung object
Tanda kurung siku menampung array

Data JSON – Nama dan Nilai

Data JSON ditulis sebagai pasangan nama / nilai, seperti properti object JavaScript.

Pasangan nama / nilai terdiri dari nama bidang (dalam tanda kutip ganda), diikuti oleh titik dua, diikuti dengan nilai:

"firstName":"John"

Nama pada JSON membutuhkan tanda kutip ganda. Nama pada JavaScript tidak.

Object JSON

Object JSON ditulis di dalam kurung kurawal.

Sama seperti di JavaScript, object dapat berisi beberapa pasangan nama / nilai:

{"firstName":"John", "lastName":"Doe"}

Array JSON

Array pada JSON ditulis di dalam tanda kurung siku.

Sama seperti di JavaScript, sebuah array dapat berisi object:

"employees":[
  {"firstName":"John", "lastName":"Doe"},
  {"firstName":"Anna", "lastName":"Smith"},
  {"firstName":"Peter", "lastName":"Jones"}
]

Dalam contoh di atas, object “karyawan” adalah array. Array tersebut berisi tiga object.

Setiap object adalah catatan seseorang (dengan nama depan dan nama belakang).

Mengonversi Teks JSON menjadi Object JavaScript

Penggunaan umum JSON adalah untuk membaca data dari server web, dan menampilkan data di halaman web.

Sederhanyan, penggunaan JSON dapat didemonstrasikan dengan menggunakan string sebagai input.

Pertama, buat string JavaScript yang berisi sintaks JSON:

var text = '{ "employees" : [' +
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';

Kemudian, gunakan fungsi JSON.parse() bawaan JavaScript untuk mengonversi string menjadi object JavaScript:

var obj = JSON.parse(text);

Terakhir, gunakan object JavaScript baru di halaman.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>Buat Object dari JSON String</h2>

<p id="demo"></p>

<script>
var text = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';

obj = JSON.parse(text);
document.getElementById("demo").innerHTML =
obj.employees[1].firstName + " " + obj.employees[1].lastName;
</script>

</body>
</html>

javascript