Dalam tutorial ini, Anda akan belajar tentang JSON dan bagaimana JavaScript digunakan dengan JSON dengan bantuan contoh.
JSON adalah singkatan dari Javascript Object Notation. JSON adalah format data berbasis teks yang digunakan untuk menyimpan dan mentransfer data. Sebagai contoh,
// JSON syntax ( "name": "John", "age": 22, "gender": "male", )
Di JSON, data berada dalam pasangan kunci / nilai yang dipisahkan dengan koma ,.
JSON berasal dari JavaScript. Jadi, sintaks JSON menyerupai sintaks literal objek JavaScript. Namun, format JSON dapat diakses dan dibuat oleh bahasa pemrograman lain juga.
Catatan : Objek JavaScript dan JSON tidak sama. Anda akan mempelajari perbedaan mereka nanti di tutorial ini.
Data JSON
Data JSON terdiri dari pasangan kunci / nilai yang mirip dengan properti objek JavaScript. Kunci dan nilai ditulis dalam tanda kutip ganda yang dipisahkan oleh titik dua :. Sebagai contoh,
// JSON data "name": "John"
Catatan : Data JSON membutuhkan tanda kutip ganda untuk kunci tersebut.
Objek JSON
Objek JSON ditulis di dalam kurung kurawal ( ). Objek JSON dapat berisi beberapa pasangan kunci / nilai . Sebagai contoh,
// JSON object ( "name": "John", "age": 22 )
Array JSON
Array JSON ditulis di dalam tanda kurung siku ( ). Sebagai contoh,
// JSON array ( "apple", "mango", "banana") // JSON array containing objects ( ( "name": "John", "age": 22 ), ( "name": "Peter", "age": 20 ). ( "name": "Mark", "age": 23 ) )
Catatan : Data JSON dapat berisi objek dan array. Namun, tidak seperti objek JavaScript, data JSON tidak boleh berisi fungsi sebagai nilai.
Mengakses Data JSON
Anda dapat mengakses data JSON menggunakan notasi titik. Sebagai contoh,
// JSON object const data = ( "name": "John", "age": 22, "hobby": ( "reading" : true, "gaming" : false, "sport" : "football" ), "class" : ("JavaScript", "HTML", "CSS") ) // accessing JSON object console.log(data.name); // John console.log(data.hobby); // ( gaming: false, reading: true, sport: "football") console.log(data.hobby.sport); // football console.log(data.class(1)); // HTML
Kami menggunakan .notasi untuk mengakses data JSON. Sintaksnya adalah:variableName.key
Anda juga dapat menggunakan sintaks kurung siku ()untuk mengakses data JSON. Sebagai contoh,
// JSON object const data = ( "name": "John", "age": 22 ) // accessing JSON object console.log(data("name")); // John
Objek JavaScript VS JSON
Meskipun sintaks JSON mirip dengan objek JavaScript, JSON berbeda dari objek JavaScript.
| JSON | Objek JavaScript |
|---|---|
| Kunci dalam pasangan kunci / nilai harus dalam tanda kutip ganda. | Kunci dalam pasangan kunci / nilai boleh tanpa tanda kutip ganda. |
| JSON tidak boleh berisi fungsi. | Objek JavaScript dapat berisi fungsi. |
| JSON dapat dibuat dan digunakan oleh bahasa pemrograman lain. | Objek JavaScript hanya dapat digunakan di JavaScript. |
Mengonversi JSON ke Objek JavaScript
Anda dapat mengonversi data JSON menjadi objek JavaScript menggunakan JSON.parse()fungsi bawaan. Sebagai contoh,
// json object const jsonData = '( "name": "John", "age": 22 )'; // converting to JavaScript object const obj = JSON.parse(jsonData); // accessing the data console.log(obj.name); // John
Mengonversi Objek JavaScript ke JSON
Anda juga dapat mengonversi objek JavaScript ke format JSON menggunakan fungsi bawaan JavaScript JSON.stringify(). Sebagai contoh,
// JavaScript object const jsonData = ( "name": "John", "age": 22 ); // converting to JSON const obj = JSON.stringify(jsonData); // accessing the data console.log(obj); // "("name":"John","age":22)"
Penggunaan JSON
JSON adalah format yang paling umum digunakan untuk mentransmisikan data (pertukaran data) dari server ke klien dan sebaliknya. Data JSON sangat mudah diurai dan digunakan. Akses dan manipulasi data JSON cepat karena hanya berisi teks.
JSON tidak bergantung pada bahasa. Anda juga dapat membuat dan menggunakan JSON dalam bahasa pemrograman lain.
