Lompat ke konten Lompat ke sidebar Lompat ke footer

Apa Itu JSON?

Sehabis kita mengenali apa itu Website API serta metode pengujiannya memakai Postman, saat ini saatnya kita menekuni sesuatu format yang biasa digunakan dalam transaksi informasi memakai Website API, ialah JSON.
Jauh pada modul lebih dahulu, ataupun bila Kamu telah menjajaki kelas Belajar Dasar Pemrograman Websitepastinya Kamu telah memahami serta memakai JSON bukan? Pada modul kali ini kita hendak mangulas JSON lebih perinci lagi.
JSON sendiri merupakan singkatan dari JavaScript Object Notation. JSON ialah format yang kerap digunakan dalam pertukaran informasi. Dikala ini JSON banyak diandalkan sebab formatnya berbasis bacaan serta relatif gampang dibaca.
Bukan cuma JavaScript, meski mempunyai nama JavaScript Object Notation, format JSON ini bisa digunakan oleh nyaris seluruh bahasa pemrograman yang terdapat. Bila Kamu belajar fundamental dalam membangun aplikasi Android pada kelas Dicoding, baik memakai Kotlin maupun Java, Kamu hendak berhadapan dengan JSON buat transaksi informasinya.
Kemudian semacam apa sesungguhnya rupa JSON ini? Struktur JSON bisa tercipta dari 2 (2) literal informasi, ialah objek serta array.

  1. {

  2.     "error": false,

  3.     "message": "success",

  4.     "books": [

  5.     {

  6.     "id": 1,

  7.     "title": "Laskar Pelangi",

  8.     "author": "Andrea Hirata"

  9.     },

  10.     {

  11.     "id": 2,

  12.     "title": "Filosofi Kopi",

  13.     "author": "Dewi Lestari"

  14.     },

  15.     {

  16.     "id": 3,

  17.     "title": "Clean Code",

  18.     "author": "Robert C Martin"

  19.     }

  20.    ]

  21. }

  22.  

  23.  


Informasi yang ialah objek pada JSON senantiasa dimulai dengan tanda{ (buka kurung kurawal)  serta diakhiri dengan tanda tutup kurung kurawal } (tutup kurung kurawal). Sebaliknya array pada JSON senantiasa dimulai dengan tanda[ (buka kurung siku) serta diakhiri dengan tanda ] (tutup kurung siku).
20200313225902ae266e132fb41907aef8dbcd4201c57c.png
Struktur dari JSON pula memakai format key: value buat menunjukkan informasinya. Contoh di atas error ialah key serta false ialah value. Penyusunan JSON hampir identik dengan JavaScript objek. Tetapi key pada JSON senantiasa dituliskan di dalam tanda “ “ (kutip 2).

  1. { "message": "success" }


Pada JSON value kita bisa menetapkan nilai dengan bermacam jenis informasi, di antara lain:
  • String
  • Number
  • Object
  • Array
  • Boolean
  • Null

Using JSON in JavaScript

Sehabis memahami rupa, struktur serta penyusunan JSON, berikutnya gimana metode memakai JSON pada JavaScript? Sama semacam memakai objek JavaScript biasa!

  1. const data = {

  2. "error": false,

  3. "message": "success",

  4. "books": [

  5. {

  6. "id": 1,

  7. "title": "Laskar Pelangi",

  8. "author": "Andrea Hirata"

  9. },

  10. {

  11. "id": 2,

  12. "title": "Filosofi Kopi",

  13. "author": "Dewi Lestari"

  14. },

  15. {

  16. "id": 3,

  17. "title": "Clean Code",

  18. "author": "Robert C Martin"

  19. }

  20. ]

  21. };

  22.  

  23. console.log(`Error? ${data.error}`);

  24. console.log("Daftar Buku: ");

  25. data.books.forEach((book, index) => {

  26. console.log(`${index + 1}. ${book.title} (${book.author})`);

  27. })

  28.  

  29. /* output

  30. Error? false

  31. Daftar Buku:

  32. 1. Laskar Pelangi (Andrea Hirata)

  33. 2. Filosofi Kopi (Dewi Lestari)

  34. 3. Clean Code (Robert C Martin)

  35. */


Kita dapat mengakses informasi JSON objek memakai tanda titik sehabis variabel yang menampungnya. Contoh metode mengakses informasi dengan key books seperti:

  1. data.books


Tetapi bila key terdiri dari karakter yang tidak bisa digunakan dalam penamaan variabel seperti white spacedashslash ataupun yang lain, informasinya bisa kita askes lewat indexing seperti ini:

  1. const data = {

  2.   ....,

  3.  "book list": [

  4.   ......

  5.  ]

  6. };

  7.  

  8. data["book list"].forEach((book, index) => {

  9.  console.log(`${index + 1}. ${book.title} (${book.author})`);

  10. })

  11.  

  12. /* output

  13. Daftar Buku:

  14. 1. Laskar Pelangi (Andrea Hirata)

  15. 2. Filosofi Kopi (Dewi Lestari)

  16. 3. Clean Code (Robert C Martin)

  17. */


Seperti yang telah kita tahu, JSON ini umumnya digunakan buat transaksi informasi ke/ dari website server. Ketika transaksi informasi berlangsung, informasi  tersebut senantiasa dalam wujud string.
20200313230409c9fc8c2540e6f3f5d173d016dba073e3.pngContoh JSON yang dihasilkan oleh Web Server
Nah untuk mengelola informasi JSON dalam wujud string pada JavaScript, kita butuh melaksanakan parse dengan memakai global object JSON. Ada 2 metode penting dalam global object JSON, yang awal parse() serta yang kedua stringify()
Method JSON.parse() digunakan buat mengganti JSON dalam wujud String jadi objek JavaScript. Contohnya seperti ini:

  1. const jsonString = `{

  2.  "error": false,

  3.  "message": "success",

  4.  "books": [

  5.    {

  6.      "id": 1,

  7.      "title": "Laskar Pelangi",

  8.      "author": "Andrea Hirata"

  9.    },

  10.    {

  11.      "id": 2,

  12.      "title": "Filosofi Kopi",

  13.      "author": "Dewi Lestari"

  14.    },

  15.    {

  16.      "id": 3,

  17.      "title": "Clean Code",

  18.      "author": "Robert C Martin"

  19.    }

  20.  ]

  21. }`;

  22.  

  23. const data = JSON.parse(jsonString);

  24.  

  25. data.books.forEach((book, index) => {

  26.  console.log(`${index + 1}. ${book.title} (${book.author})`);

  27. })

  28.  

  29. /* output

  30. Daftar Buku:

  31. 1. Laskar Pelangi (Andrea Hirata)

  32. 2. Filosofi Kopi (Dewi Lestari)

  33. 3. Clean Code (Robert C Martin)

  34. */


Kemudian metode JSON.stringify() mempunyai guna kebalikannya. Ialah mengganti JavaScript objek dalam wujud JSON string. Contohnya seperti ini:

  1. const data = {

  2.  error: false,

  3.  message: "success",

  4.  books: [

  5.    {

  6.      "id": 1,

  7.      "title": "Laskar Pelangi",

  8.      "author": "Andrea Hirata"

  9.    },

  10.    {

  11.      "id": 2,

  12.      "title": "Filosofi Kopi",

  13.      "author": "Dewi Lestari"

  14.    },

  15.    {

  16.      "id": 3,

  17.      "title": "Clean Code",

  18.      "author": "Robert C Martin"

  19.    }

  20.  ]

  21. };

  22.  

  23. const jsonString = JSON.stringify(data);

  24. console.log(jsonString);

  25.  

  26. /* output:

  27. {"error":false,"message":"success","books":[{"id":1,"title":"Laskar Pelangi","author":"Andrea Hirata"},{"id":2,"title":"Filosofi Kopi","author":"Dewi Lestari"},{"id":3,"title":"Clean Code","author":"Robert C Martin"}]}

  28. */


Posting Komentar untuk "Apa Itu JSON?"