Forum | tutorial pengembangan web terbaru
 

JSON tutorial

JSON: JavaScript Object Notation.

JSON adalah sintaks untuk menyimpan dan bertukar data.

JSON merupakan alternatif yang lebih mudah digunakan untuk XML.


JSON mengikuti contoh mendefinisikan karyawan objek, dengan array 3 catatan karyawan:

JSON Contoh

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

XML mengikuti contoh juga mendefinisikan karyawan keberatan dengan 3 catatan karyawan:

XML Contoh

<employees>
    <employee>
        <firstName>John</firstName> <lastName>Doe</lastName>
    </employee>
    <employee>
        <firstName>Anna</firstName> <lastName>Smith</lastName>
    </employee>
    <employee>
        <firstName>Peter</firstName> <lastName>Jones</lastName>
    </employee>
</employees>

Apa itu JSON?

  • JSON adalah singkatan dari JavaScript Object Notation
  • JSON adalah format data-interchange ringan
  • JSON adalah bahasa independen *
  • JSON adalah "self-describing" dan mudah dimengerti

* JSON menggunakan sintaks JavaScript, tetapi format JSON adalah teks saja, seperti XML.
Teks dapat dibaca dan digunakan sebagai format data dengan bahasa pemrograman.


JSON - Mengevaluasi untuk Objects JavaScript

Format JSON adalah sintaksis identik dengan kode untuk membuat objek JavaScript.

Karena kesamaan ini, alih-alih menggunakan parser (seperti XML tidak), sebuah program JavaScript dapat menggunakan fungsi JavaScript standar untuk mengkonversi data JSON menjadi objek JavaScript asli.


Cobalah sendiri

Dengan editor kami, Anda dapat mengedit kode JavaScript secara online dan klik tombol untuk melihat hasilnya:

JSON Contoh

<!DOCTYPE html>
<html>
<body>

<h2>JSON Object Creation in JavaScript</h2>

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

<script>
var text = '{"name":"John Johnson","street":"Oslo West 16","phone":"555 1234567"}';

var obj = JSON.parse(text);

document.getElementById("demo").innerHTML =
obj.name + "<br>" +
obj.street + "<br>" +
obj.phone;
</script>

</body>
</html>
Cobalah sendiri "

Banyak Seperti XML Karena

  • Kedua JSON dan XML yang "menggambarkan diri" (dibaca manusia)
  • Kedua JSON dan XML yang hirarkis (nilai-nilai dalam nilai-nilai)
  • Kedua JSON dan XML bisa diurai dan digunakan oleh banyak bahasa pemrograman
  • Kedua JSON dan XML dapat diambil dengan XMLHttpRequest

Banyak Tidak seperti XML Karena

  • JSON tidak menggunakan tag akhir
  • JSON lebih pendek
  • JSON lebih cepat untuk membaca dan menulis
  • JSON dapat menggunakan array

Perbedaan terbesar adalah:

XML harus diurai dengan parser XML. JSON bisa diurai oleh fungsi JavaScript standar.


Mengapa JSON?

Untuk aplikasi AJAX, JSON lebih cepat dan lebih mudah daripada XML:

menggunakan XML

  • Mengambil dokumen XML
  • Gunakan DOM XML untuk loop melalui dokumen
  • nilai ekstrak dan simpan dalam variabel

menggunakan JSON

  • Ambil string JSON
  • JSON.parse string JSON