Saturday, August 20, 2011

Apa JSON?

JSON (Javascript Object Notation) merupakan f ormat ringan untuk memasukan data ke dalam
variabel. Sangat mudah dimengerti dan diimplementasikan oleh manusia, dan mudah juga untuk
komputer dalam melakukan parsingnya..
Terdapat Beberapa cara memasukan Array ke dalam variabel dalam Javascript, yaitu:

/* Dengan New Array */
var array_ke_1 = new Array('Satu','Dua','Tiga');
/* Dengan New Array dan Memasukan Satu Per-Satu */
var array_ke_2 = new Array();
array_ke_2[0] = 'Satu';
array_ke_2[1] = 'Dua';
array_ke_2[2] = 'Tiga';
/* Dengan Format JSON */
var array_ke_3 = ['Satu','Dua','Tiga'];

Pada contoh di atas terlihat jelas kenapa f ormat JSON sangat bermanf aat untuk melakukan
ef isiensi transf er data dan coding, karena hanya membutuhkan sedikit karakter untuk inisialisasi
variabel array tersebut. Berikut adalah contoh yang lebih kompleks:
/* Menggunakan new Array() */
var a1 = new Array(new Array('Ahmad','Amarullah'),new Array('Idik','Nursidik'));
/* Menggunakan Format JSON */
var a2 = [['Ahmad','Amarullah'],['Idik','Nursidik']];

Pada dasarnya f ormat ini memiliki sintaks yang sangat sederhana, yaitu
[ ] - Menerangkan bahwa isi di dalamnya berada pada scope Array
{ } - Menerangkan bahwa isi di dalamnya berada pada scope Object

Contoh Penggunaan JSON
Pada bagian ini, Kita akan langsung melakukan praktek penggunaan JSON.
<html>
<head>
<title>Test JSON</title>
</head>
<body>
<script type="text/javascript">

/* Data Awal dengan format JSON */
var aku =
{
'nama':'Ahmad Amarullah',
'kesukaan':
['Tidur','Internetan','Coding'],

'saudara':
{
'kakak':
['Ujang','Nunung'],
'sepupu':
['Hasna','Hasbi','Hanif']
},
'nomor_punggung':9,
'fungsi':function(){
alert('Hallo Saya Ahmad...');
},
'status':'Menikah'
};
/* Tampilkan Nama */
document.write('Nama : '+aku.nama+'<br />');
/* Looping untuk menampilkan Kesukaan */
document.write('Kesukaan: <ol>');
for (var i=0;i<aku.kesukaan.length;i++){
document.write('<li>'+aku.kesukaan[i]+'</li>');
}
document.write('</ol>');
/* Looping untuk menampilkan Kakak */
document.write('Saudara - Kakak: <ol>');
for (var i=0;i<aku.saudara.kakak.length;i++){
document.write('<li>'+aku.saudara.kakak[i]+'</li>');
}
document.write('</ol>');
/* Looping untuk menampilkan Sepupu */
document.write('Saudara - Sepupu: <ol>');
for (var i=0;i<aku.saudara.sepupu.length;i++){
document.write('<li>'+aku.saudara.sepupu[i]+'</li>');
}
document.write('</ol>');
/* Tampilkan Nomor Punggung */
document.write('Nomor Punggung : '+aku.nomor_punggung+'<br />');
/* Tampilkan Status */
document.write('Status : '+aku.status+'<br />');
/* Jalankan Fungsi */
aku.fungsi();

</script>
</body>
</html>

Hasil yang akan didapat adalah seperti berikut:
Nama : Ahmad Amarullah
Ke sukaan:
1. Tidur
2. Internetan
3. Coding
Saud ara - Kakak:
1. Ujang
2. Nunung
Saudara - Sepupu:
1. Hasna
2. Hasbi
3. Hanif
No mo r Pung g ung : 9
Status : Me nikah

0 comments:

Post a Comment