Mengenal Lebih Dekat JSON dalam JavaScript

Javascript

Menurut tiobe, javascript masih menjadi bahasa pemrograman terpopuler sejagat raya. Kali ini kita akan membahas tentang JSON di JavaScript.

Salah satu fitur menarik yang banyak dicintai para programmer javascript dalam bertukar data ialah menggunakan format JSON.

Mungkin karena JSON berasal dari bahasa pemrograman JavaScript, itu adalah pilihan alami untuk digunakan sebagai format data dalam JavaScript. JSON adalah singkatan dari JavaScript Object Notation, biasanya diucapkan seperti nama “Jason”.

Pada umumnya JSON sangat tepat digunakan untuk beberapa proses berikut :

  • Menyimpan data
  • Menghasilkan struktur data dari input pengguna
  • Mentransfer data dari server ke klien, klien ke server, dan server ke server
  • Mengkonfigurasi dan memverifikasi data

Data JSON biasanya diakses dalam Javascript melalui notasi titik. Untuk memahami cara kerjanya, mari pertimbangkan objek JSON sammy:

var sammy = { 
  "first_name"  :  "Sammy", 
  "last_name"   :  "Shark", 
  "online"      :  true 
}

Untuk mengakses salah satu nilai, kita akan menggunakan notasi titik seperti berikut:

sammy.first_name
sammy.last_name
sammy.online

Fungsi untuk Bekerja dengan JSON
Bagian ini akan melihat dua metode untuk meregangkan dan mem-parsing JSON. Mampu mengkonversi JSON dari objek ke string dan sebaliknya berguna untuk mentransfer dan menyimpan data.

JSON.stringify()
Fungsi JSON.stringify() mengubah objek ke string JSON.

String berguna untuk mengangkut data dari klien ke server melalui menyimpan atau meneruskan informasi dengan cara yang ringan. Misalnya, Anda dapat mengumpulkan pengaturan pengguna di sisi klien dan kemudian mengirimkannya ke server. Kemudian, Anda dapat membaca informasi dengan metode JSON.parse() dan dapat menggunakan data tersebut sesuai dengan kebutuhan.

var obj = {"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}

var s = JSON.stringify(obj)

Sekarang kita telah memiliki s sebagai string yang siap untuk kita gunakan. Jika s di cetak akan jadi seperti berikut :

'{"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}'

Fungsi JSON.stringify() memungkinkan kita mengonversi objek menjadi string. Untuk melakukan mengembalikan ke objek, kita akan dapat menggunakan fungsi JSON.parse().

var o = JSON.parse(s)

Untuk mempelajari lebih dalam lagi, mari kita perhatikan contoh JSON.parse() dalam konteks file HTML berikut:

<!DOCTYPE html>
<html>
<body>

  <p id="user"></p>

  <script>
    var s = '{"first_name" : "Sammy", "last_name" : "Simon", "location" : "Medan"}';
    var obj = JSON.parse(s);
    document.getElementById("user").innerHTML =
      "Name: " + obj.first_name + " " + obj.last_name + "<br>" +
      "Location: " + obj.location;
  </script>
</body>
</html>

script diatas akan menghasilkan output:

Name: Sammy Simon
Location: Medan

Dalam konteks file HTML, kita dapat melihat bagaimana string JSON dikonversi menjadi objek yang dapat diambil pada rendering akhir halaman dengan mengakses JSON melalui notasi titik.

JSON.parse() adalah fungsi aman untuk mem-parsing string JSON dan mengubahnya menjadi objek.

Artikel Terkait

Populer

;