Penjelasan Tentang Format Data Respon Ajax

Ketika Ajax mengirim request ke server, maka akan ada balasan dari server berupa data. Nah,
data yang dikirim dari server ke ajax ini ada macam-macam. Pada contoh-contoh sebelumnya,
anda telah melihat data yang dikirim berupa text atau HTML. Seperti contoh di bawah ini,
program PHP memberikan data berupa HTML
while($k=mysql_fetch_array($query)){
echo '<li onClick="isi(\''.$k[0].'\');"
style="cursor:pointer">'.$k[0].'</li>';
}
Pada contoh tersebut, program PHP memberikan output berupa HTML dengan tag <li>. Ada
beberapa format data yang populer yang biasa digunakan untuk untuk mengirim data dari server
ke client, yaitu JSON, Text, AHAH, XML dan lainnya.

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, Standar ECMA-262 Edisi ke-3
- Desember 1999. 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 dll. Oleh karena sifat-sifat
tersebut, menjadikan JSON ideal sebagai bahasa pertukaran-data.
Beberapa orang lebih suka JSON, karena paling mudah untuk mem-parse-nya, hanya
menempatkan sebuah eval dan selesai sudah.
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.
JSON menggunakan bentuk sebagai berikut:
Object adalah sepasang nama/nilai yang tidak terurutkan. Objek dimulai dengan { (kurung
kurawal buka) dan diakhiri dengan } (kurung kurawal tutup). Setiap nama diikuti dengan : (titik
dua) dan setiap pasangan nama/nilai dipisahkan oleh , (koma).

Array adalah kumpulan nilai yang terurutkan. Larik dimulai dengan [ (kurung kotak buka) dan
diakhiri dengan ] (kurung kotak tutup). Setiap nilai dipisahkan oleh , (koma).
Nilai (value) dapat berupa sebuah string dalam tanda kutip ganda, atau angka, atau true atau
false atau null, atau sebuah objek atau sebuah larik. Struktur-struktur tersebut dapat disusun
bertingkat.
String adalah kumpulan dari nol atau lebih karakter Unicode, yang dibungkus dengan tanda kutip
ganda. Di dalam string dapat digunakan backslash escapes "\" untuk membentuk karakter khusus.
Sebuah karakter mewakili karakter tunggal pada string. String sangat mirip dengan string C atau Java

Contoh JSON
Sekarang mari kita lihat contoh-contoh bentuk JSON yang saya ambil dari json.org. Berikut bentuk
XML, yang telah familiar dengan kita.
<menu id="file" value="File">
<popup>
<menuitem value="New" onclick="CreateNewDoc()" />
<menuitem value="Open" onclick="OpenDoc()" />
<menuitem value="Close" onclick="CloseDoc()" />
</popup>
</menu>
Jika kita ubah ke bentuk JSON adalah :
{"menu": {
"id": "file",
"value": "File",
"popup": {
"menuitem": [
{"value": "New", "onclick": "CreateNewDoc()"},
{"value": "Open", "onclick": "OpenDoc()"},
{"value": "Close", "onclick": "CloseDoc()"}
]
}
}}
Bentuk XML :
<widget>
<debug>on</debug>
<window title="Sample Konfabulator Widget">
<name>main_window</name>
<width>500</width>
<height>500</height>
</window>
<image src="Images/Sun.png" name="sun1">
<hOffset>250</hOffset>
<vOffset>250</vOffset>
<alignment>center</alignment>
</image>
<text data="Click Here" size="36" style="bold">
<name>text1</name>
<hOffset>250</hOffset>
<vOffset>100</vOffset>
<alignment>center</alignment>
<onMouseUp>
sun1.opacity = (sun1.opacity / 100) * 90;
</onMouseUp>
</text>
</widget>

Bentuk JSON :
{"widget": {
"debug": "on",
"window": {
"title": "Sample Konfabulator Widget",
"name": "main_window",
"width": 500,
"height": 500
},
"image": {
"src": "Images/Sun.png",
"name": "sun1",
"hOffset": 250,
"vOffset": 250,
"alignment": "center"
},
"text": {
"data": "Click Here",
"size": 36,
"style": "bold",
"name": "text1",
"hOffset": 250,
"vOffset": 100,
"alignment": "center",
"onMouseUp": "sun1.opacity = (sun1.opacity / 100) * 90;"
}
}}