Fundamental

Selain Media Transmisi Data Inilah Kegunaan JSON

Reza Daulay

14 Nov 2023 • 2 min read

Dalam pemograman modern khususnya Javascript kita seringkali berhadapan dengan istilah JSON, tapi apakah kalian sudah paham apa itu JSON dan apa saja kegunaan JSON selain sebagai media transmisi data? Yuk mari kita bahas.

Apa Itu JSON?

JSON sendiri pertama kali di adalah sebuah format file yang menyimpan informasi, JSON pertama kali ditemukan oleh Douglas Crockfor. JSON dianggap lebih ringan dan sederhana dibandingkan pendahulunya XML (Extensive Markup Language). XML lebih sulit di konversi menjadi objek javascript dibandingkan JSON.

Perbandingan JSON dan XML

Mari kita bandingkan XML dan JSON, kita akan melakukan parsing data dari XML dan JSON berikut,

<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>

nama-pegawai.xml

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

nama-pegawai.json

Parsing Data XML

<!DOCTYPE html>
<html>
<body>

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

<script>
let text = "<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>";

let parser = new DOMParser();
let xmlDoc = parser.parseFromString(text,"text/xml");
let output = xmlDoc.getElementsByTagName("employee")[0].getElementsByTagName("firstName")[0].childNodes[0].nodeValue
console.log(output)
</script>

</body>
</html>

Diatas ada barisan code dimana kita hendak mengambil data firstName karyawan diurutan pertama XML.

Parsing Data JSON

Mari kita lakukan hal yang sama dengan data format JSON,

<!DOCTYPE html>
<html>
<body>

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

<script>
let text = '{"employees":['+
  '{ "firstName":"John", "lastName":"Doe" },'+
  '{ "firstName":"Anna", "lastName":"Smith" },'+
  '{ "firstName":"Peter", "lastName":"Jones" }'+
']}';

let parser = JSON.parse(text);
let output = parser.employees[0].firstName
console.log(output)
</script>

</body>
</html>

Dapat kita simpulkan penggunaan JSON lebih efisien, mudah dan rapi dibandingkan menggunakan format data XML.

Apa Saja Kegunaan JSON?

Transmisi Data

JSON seringkali digunakan sebagai format komunikasi antara dua environment yang berbeda baik antar backend ke frontend, maupun antar backend ke backend, dan sebagainya. Dengan menggunakan format JSON dua sistem atau lebih dapat saling berkomunikasi walaupun 2 sistem tadi berbeda bahasa pemograman.

File Konfigurasi

JSON juga sering dipakai sebagai file konfigurasi projek. Misalnya, Express.js, React.js, Vue.js dan lain sebagainya menggunakan file JSON sebagai media informasi file konfigurasi projek.

Penyimpanan Data

Selain sebagai Tranmisi Data dan File Konfigurasi, JSON juga dapat digunakan sebagai penyimpanan data. Rata-rata database NoSQL menggunakan JSON sebagai format data untuk menyimpan data. Hal ini dikarenakan JSON menggunakan struktur key-value pair sehingga datanya lebih mudah disimpan dan diambil menggunakan query.