JavaScript dan JSON (dengan Contoh)

Dalam tutorial ini, anda akan belajar mengenai JSON dan bagaimana JavaScript digunakan dengan JSON dengan bantuan contoh.

JSON bermaksud Notasi Objek Javascript. JSON adalah format data berasaskan teks yang digunakan untuk menyimpan dan memindahkan 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. Walau bagaimanapun, format JSON dapat diakses dan dibuat oleh bahasa pengaturcaraan lain juga.

Catatan : Objek JavaScript dan JSON tidak sama. Anda akan mengetahui perbezaan mereka kemudian dalam tutorial ini.

Data JSON

Data JSON terdiri daripada pasangan kunci / nilai yang serupa dengan sifat objek JavaScript. Kunci dan nilai ditulis dalam petikan berganda yang dipisahkan oleh titik dua :. Sebagai contoh,

 // JSON data "name": "John"

Catatan : Data JSON memerlukan tanda petik berganda untuk kunci tersebut.

Objek JSON

Objek JSON ditulis di dalam pendakap kerinting ( ). Objek JSON boleh mengandungi beberapa pasangan kunci / nilai . Sebagai contoh,

 // JSON object ( "name": "John", "age": 22 )

Susunan JSON

Susunan JSON ditulis di dalam tanda kurung persegi ( ). 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 boleh mengandungi objek dan tatasusunan. Namun, tidak seperti objek JavaScript, data JSON tidak dapat memuat fungsi sebagai nilai.

Mengakses Data JSON

Anda boleh 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 boleh menggunakan sintaks kurungan persegi ()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

Walaupun sintaks JSON mirip dengan objek JavaScript, JSON berbeza dengan objek JavaScript.

JSON Objek JavaScript
Kekunci dalam pasangan kunci / nilai harus dalam tanda petik dua kali. Kekunci dalam pasangan kunci / nilai boleh tanpa tanda petik dua kali.
JSON tidak boleh mengandungi fungsi. Objek JavaScript boleh mengandungi fungsi.
JSON boleh dibuat dan digunakan oleh bahasa pengaturcaraan lain. Objek JavaScript hanya dapat digunakan dalam JavaScript.

Menukar JSON ke Objek JavaScript

Anda boleh menukar data JSON ke 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

Menukar Objek JavaScript ke JSON

Anda juga dapat menukar objek JavaScript ke format JSON menggunakan fungsi built-in 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 sering digunakan untuk menghantar data (pertukaran data) dari pelayan ke klien dan sebaliknya. Data JSON sangat mudah dihurai dan digunakan. Sangat cepat untuk mengakses dan memanipulasi data JSON kerana hanya mengandungi teks.

JSON bebas bahasa. Anda juga boleh membuat dan menggunakan JSON dalam bahasa pengaturcaraan lain.

Artikel menarik...