Apa Itu JavaScript Object Notation (JSON)? Simak Lengkapnya Hanya Di Artikel Ini

Memahami Pengertian dan Fungsi JSON

JavaScript Object Notation (JSON) adalah format berbasis teks standar untuk merepresentasikan data terstruktur berdasarkan sintaksis objek JavaScript.

Format ini biasanya digunakan untuk menyimpan dan mentransfer data antara server dan klien dalam aplikasi web. Misalnya saat mengirimkan data dari server ke klien agar dapat ditampilkan di halaman web, dan sebaliknya.

JSON adalah format data yang dipopulerkan oleh Douglas Crockford yang sangat mirip dengan sintaks literal objek JavaScript. Representasi objek ini mempunyai tempat sebagai string, yang terlebih dahulu harus diubah menjadi objek JavaScript asli jika pemrogram ingin mengakses data yang dikirim melalui jaringan.

Membandingkan JSON vs XML

Jika Anda membaca pendahuluan di awal, kami mengatakan bahwa sintaksis dan notasi objek JSON lebih unggul daripada XML. Apa alasannya?

Contoh kedua penulisan sintaks ditunjukkan di bawah.

JSON

{“employees”:[
{“name”:“Andi Surandi”, “age”:“28”, “city”:“Jakarta”},
{“name”:“Putri”, “age”:“27”, “city”:“Surabaya”},
{“name”:“Agus”, “age”:“26”, “city”:“Yogyakarta”},
{“name”:“Siti”, “age”:“30”, “city”:“Bandung”}
]}
{“employees”:[

XML

<employees>
<employee>
<name>Andi Surandi</name> <age>28</age> <city>Jakarta</city>
</employee>
<employee>
<name>Putri</name> <age>27</age> <city>Surabaya</city>
</employee>
<employee>
<name>Agus</name> <age>26</age> <city>Yogyakarta</city>
</employee>
<employee>
<name>Siti</name> <age>30</age> <city>Bandung</city>
</employee>
</employees>

Seperti yang dapat Anda lihat dengan jelas, sintaks notasi objek JavaScript jauh lebih sederhana dan tepat daripada XML, karena tidak memerlukan tanda kurung buka dan tutup. Selain itu, notasi objek JavaScript menggunakan array yang tidak tersedia dalam XML, sehingga mengurangi ukuran file.

Tipe Struktur Data JSON

Seperti dijelaskan di atas, JSON adalah string yang format datanya sangat mirip dengan format literal objek JavaScript. Ini memungkinkan Anda menyertakan tipe data dasar yang juga digunakan dalam objek JavaScript standar, yakni string, number, array, boolean, dan literal objek lainnya.

Contoh:

{
“name”: “DomaiNesia”, >> String
“age”: 12, >> number
“service”: true, >> boolean
“powers”: [ >> array
“Penyedia Web Hosting Terbaik di Indonesia”,
“Penyedia Domain Murah”
]
}

1. Object JSON

Object pada JSON adalah sintaks yang terdiri dari pasangan key dan value, selalu dibuka dan ditutup dengan kurung kurawal ({…}).

Contoh Object:

var andi= {
“name” : “Andi Surandi”,
“age” : “28”,
“gender” : “pria”
};

Sintaks di atas merupakan susunan objek yang dapat kita akses menggunakan variabel chaitanya.

Di dalam sebuah objek kamu dapat memiliki sejumlah pasangan key-value seperti yang kita miliki di atas.

Cara mengakses informasi dari objek JSON adalah seperti berikut:

Sintaks di atas adalah array objek yang dapat diakses menggunakan variabel Chaitanya. Seperti dijelaskan di atas, sebuah objek dapat berisi sejumlah pasangan key-value.

Mengakses informasi dari objek JSON dilakukan sebagai berikut.

document.writeln("Nama: " +andi.name);
document.writeln("Umur: " + andi.age);
document.writeln("Jenis Kelamin: "+ andi.gender);

2. Array Object

Apabila contoh di atas digunakan untuk menyimpan informasi satu orang dalam sebuah notasi objek JavaScript, maka contoh selanjutnya akan membuat kamu dapat menyimpan informasi lebih dari satu orang yang mana kita sebut sebagai array objek.

Pengertian array pada JSON adalah kumpulan object yang selalu dibuka dan ditutup oleh tanda kurung siku ([…]).

Contoh Array Object:

Objek Array Jika Anda menggunakan contoh di atas untuk menyimpan informasi tentang seseorang dalam notasi objek JavaScript, contoh berikut memungkinkan Anda menyimpan informasi tentang banyak orang. Ini disebut sebagai array object.

Pengertian array di JSON selalu berupa kumpulan objek yang dibuka dan ditutup dengan tanda kurung siku ([…]).

Contoh Array Object:

var employees = [{
“name” : “Andi Surandi”,
“age” : “28”,
“gender” : “pria”
},
{
“name” : “Putri”,
“age” : “27”,
“gender” : “wanita”
}];

Untuk mengakses informasi pada array di atas, Anda perlu menulis kode seperti ini:

document.writeln(employees[0].age); //outputnya adalah 28
document.writeln(employees[1].name); //outputnya adalah Putri