Mengenal JSON (JavaScript Object Notation) Untuk Blogger

apa sebenarnya JSON? Mari kita belajar bersama.

Douglas Crockford master JavaScript dibelakang JSON

JSON (JavaScript Object Notation) adalah format pertukaran data yang ringan, mudah dibaca dan ditulis oleh manusia, serta mudah diterjemahkan dan dibuat (generate) oleh komputer. Format ini dibuat berdasarkan bagian dari Bahasa Pemprograman JavaScript^[4], Standar ECMA-262 Edisi ke-3 - Desember 1999^[5]. JSON merupakan format teks yang tidak bergantung pada bahasa pemprograman apapun karena menggunakan gaya bahasa yang umum digunakan oleh programmer keluarga C termasuk C, C++, C#, Java, JavaScript, Perl, Python dan lain-lain. Oleh karena sifat-sifat tersebut, menjadikan JSON ideal sebagai bahasa pertukaran-data.

JSON terbuat dari dua struktur:

Kumpulan pasangan nama/nilai. Pada beberapa bahasa, hal ini dinyatakan sebagai objek (object), rekaman (record), struktur (struct), kamus (dictionary), tabel hash (hash table), daftar berkunci (keyed list), atau associative array.
Daftar nilai terurutkan (an ordered list of values). Pada kebanyakan bahasa, hal ini dinyatakan sebagai larik (array), vektor (vector), daftar (list), atau urutan (sequence).

Struktur-struktur data ini disebut sebagai struktur data universal. Pada dasarnya, semua bahasa pemprograman moderen mendukung struktur data ini dalam bentuk yang sama maupun berlainan. Hal ini pantas disebut demikian karena format data mudah dipertukarkan dengan bahasa-bahasa pemprograman yang juga berdasarkan pada struktur data ini.

Demikian situs resmi JSON menjelaskan. Jika belum mengerti silahkan ubek-ubek internet untuk memahami apa dan bagaimana bahasa pemrograman JSON.
Dari sekian banyak bahasa pemrograman JSON, Blogger Tune-Up akan sedikit menampilkan script JSON yang paling banyak di gunakan. Tabel di bawah ini merupakan unsur yang paling penting dari struktur objek JSON untuk Blogger.

Dibawah ini contoh script penggunaan JSON pada Blog.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Blogger Tune-Up | Contoh Penggunaan JSON</title>
<script style="text/javascript">
function showrecentposts(json) {
  // sebuah pengulangan dimulai
  // dalam pengulangan ini kita mengambil entri dari feed dan paseing
  for (var i = 0; i < jumposts; i++) {
      // mengambil entri i dari feed
      var entry = json.feed.entry[i];
      // mengambil judul artikel
      var posttitle = entry.title.$t;
      // mengambil alamat artikel
      // memeriksa semua alamat untuk link dengan rel = alternate
      var posturl;
      if (i == json.feed.entry.length) break;
      for (var k = 0; k < entry.link.length; k++) {
          if (entry.link[k].rel == 'alternate') {
              posturl = entry.link[k].href;
              break;
          }
      }
      // mengambil tanggal terbit, pengambilan hanya 10 karakter pertama
      var postdate = entry.published.$t.substring(0, 10);
      // mengambil nama author
      var postauthor = entry.author[0].name.$t;
      // mengambil isi artikel
      // Jika feed Blogger di  set pada FULL, maka isi merupakan daftar utuh
      // Jika feed Blogger di  set pada SHORT, maka isi merupakan daftar penggalan/rangkuman
      if ("content" in entry) {
          var postcontent = entry.content.$t;
      }
      else if ("summary" in entry) {
          var postcontent = entry.summary.$t;
      }
      else var postcontent = "";
      // menonaktifkan semua tag HTML
      var re = /<\S[^>]*>/g;
      postcontent = postcontent.replace(re, "");
      // mereduksikan isi artikel sesuai dengan setting jumlah karakter
      if (postcontent.length > numchars) postcontent = postcontent.substring(0, numchars);
      // menampilkan hasil
      document.write('<br>');
      document.write('Entry #' + i + '<br>');
      document.write('Post title    : ' + posttitle + '<br>');
      document.write('Post url      : ' + posturl + '<br>');
      document.write('Post author   : ' + postauthor + '<br>');
      document.write('Postdate      : ' + postdate + '<br>');
      document.write('Postcontent   : ' + postcontent + '...<br>');
      document.write('<br>');
  }
}
</script>
</head>
<body>
<h2>Artikel Terbaru motaro blog</h2>
<script style="text/javascript">
var jumposts=5;
var numchars=200;
</script>
<script src="http://motaroblog.blogspot.com/feeds/posts/default?alt=json-in-script&callback=showrecentposts"></script>
</body>
</html>