Home » Javascript » Pengantar Apa Itu JSON: Tutorial dan Materi Lengkap

Pengantar Apa Itu JSON: Tutorial dan Materi Lengkap

by Catur Kurnia Sari
by Catur Kurnia Sari

JS JSON
Apa itu JSON
Sintaks JSON
JSON vs XML
Jenis Data JSON
JSON Parse
JSON Stringify
Objek JSON
JSON Array
JSON PHP
HTML JSON
JSON JSONP

JSON: Notasi Objek JavaScript.

JSON adalah sintaks untuk menyimpan data dan bertukar data.

JSON adalah teks, ditulis dengan notasi objek JavaScript.

Section Artikel

Bertukar Data

Saat bertukar data antara browser dan server, jenis data hanya dapat berupa teks.

JSON adalah teks, dan kita dapat mengonversi objek JavaScript apa pun menjadi JSON, dan mengirim JSON ke server.

Kita juga dapat mengonversi JSON apa pun yang diterima dari server menjadi objek JavaScript.

Dengan cara ini kita dapat bekerja dengan data sebagai objek JavaScript, tanpa penguraian dan terjemahan yang rumit.

Mengirim Data

Jika kita memiliki data yang disimpan dalam objek JavaScript, kita dapat mengonversi objek tersebut menjadi JSON, dan mengirimkannya ke server.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2> Ubah objek JavaScript menjadi string JSON, dan kirimkan ke server. </h2>
<script>
var myObj = { name: "John", age: 31, city: "New York" };
var myJSON = JSON.stringify(myObj);
window.location = "demo_json.php?x=" + myJSON;
</script>

</body>
</html>

Menerima data

Jika kita menerima data dalam format JSON, kitadapat mengubahnya menjadi objek JavaScript.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>Ubah string yang ditulis dalam format JSON, menjadi objek JavaScript. </h2>
<p id="demo"></p>

<script>
var myJSON = '{"name":"John", "age":31, "city":"New York"}';
var myObj = JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;
</script>

</body>
</html>

Menyimpan Data

Saat menyimpan data, data harus dalam format tertentu, dan di manapun kita memilih untuk menyimpannya, teks selalu menjadi salah satu format yang legal.

JSON memungkinkan untuk menyimpan objek JavaScript sebagai teks.

Contoh:
Menyimpan data di penyimpanan lokal

<!DOCTYPE html>
<html>
<body>

<h2>Simpan dan ambil data dari penyimpanan lokal. </h2>
<p id="demo"></p>

<script>
var myObj, myJSON, text, obj;

// Storing data:
myObj = { name: "John", age: 31, city: "New York" };
myJSON = JSON.stringify(myObj);
localStorage.setItem("testJSON", myJSON);

// Retrieving data:
text = localStorage.getItem("testJSON");
obj = JSON.parse(text);
document.getElementById("demo").innerHTML = obj.name;
</script>

</body>
</html>

Apa itu JSON?

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

*
JSON menggunakan sintaks JavaScript, tetapi format JSON hanya teks.
Teks dapat dibaca dan digunakan sebagai format data oleh bahasa pemrograman apa pun.

Format JSON dibuat oleh Douglas Crockford.

Mengapa menggunakan JSON?

Karena format JSON hanya teks, maka akan mudah dikirim ke server maupun dari server, dan digunakan sebagai format data oleh bahasa pemrograman apa pun.

JavaScript memiliki fungsi bawaan untuk mengonversi string, yang ditulis dalam format JSON, menjadi objek JavaScript asli dengan menggunakan: JSON.parse ()

Jadi, jika kita menerima data dari server, dalam format JSON kita dapat menggunakannya seperti objek JavaScript lainnya.

You may also like