Thursday, January 8, 2015

Tutorial Javascript Part 16: Mengenal Array

Array adalah variabel khusus yang dapat menangani banyak nilai sekaligus. Array juga termasuk object, jadi saat kita mengenakan fungsi typeof pada array akan mengembalikan nilai object. Namun meskipun array merupakan object akan lebih baik mendeklarasikan array sebagai array bukan sebagai object, karena akan terjadi kebingungan dalam program.

Ada dua jenis array yang sering dipakai yaitu array terindeks angka dan array assosiatif. Array terindeks angka merupakan array dengan indeks angka sedangkan array assosiatif merupakan array terindeks string. Javascript tidak mendukung aray assosiatif dan hanya mendukung array terindeks angka saja.

Membuat Array

Ada dua cara dalam membuat array yaitu membuat array kosong dan membuat array sekaligus dengan isinya.

Contoh membuat array kosong :

var buah = [];

Contoh membuat array beserta isinya :

var buah = ["Apel","Jeruk","Nangka"];

Catatan : Antar nilai dalam array dipisahkan dengan tanda koma. Setelah nilai array yang terakhir sebaiknya tidak diakhiri dengan koma karena akan menjadikan inkonsistensi pada beberapa browser.

Menambahkan data ke dalam Array

Kita bisa menambahkan data baru ke dalam array kosong maupun ke dalam array yang sudah ada isinya. Ada beberapa cara untuk manambahkan data ke dalam array, yaitu menambahkan data ke dalam array dengan indeks yang urut atau bisa juga dengan indeks acak.

Manambahkan array dengan indeks urut artinya data baru yang kita masukkan mempunyai indeks berupa indeks array terakhir ditambah satu. Cara ini lebih dianjurkan dibandingkan dengan menambahkan data baru dengan indeks acak, yaitu menambahkan data baru dengan indeks tertentu yang kosong.

Contoh menambahkan data ke dalam array secara urut :

var buah = ["Apel", "Jeruk", "Nangka"];
buah[buah.length] = "Pisang";     // menambahkan "Pisang" ke dalam array

Pada contoh diatas kita menggunakan properti length pada array untuk mendapatkan jumlah data yang ada didalam array.

Contoh menambahkan data ke dalam array secara acak pada indeks yang kosong:

var buah = ["Apel", "Jeruk", "Nangka"];
buah[10] = "Pisang";     // menambahkan "Pisang" ke dalam array indeks 10

Menampilkan isi Array

Untuk menampilkan data dari array seperti saat menampilkan data dari sebuah variabel. Sebagai contoh kita bisa menampilkan data dari array berupa string melalui tampilan html berikut ini :
 <!DOCTYPE html>  
 <html>  
 <body>  
   
 <p id="view"></p>  
   
 <script>  
 var buah = ["Apel", "Jeruk", "Nangka"];  
 document.getElementById("view").innerHTML = buah[1];  
 </script>  
   
 </body>  
 </html>  
Pada contoh kita menampilkan data dari array "buah" dengan indeks 1, sehingga jika dijalankan akan tampil "Jeruk". Lalu bagaimana jika kita mau menampilkan semua data yang ada pada array, apakah kita harus menulis indeks satupersatu?

Untuk menampilkan semua data pada array kita menggunakan bantuan perulangan seperti for atau while.

Contoh menampilkan keseluruhan data dari array dengan perulangan for :

 <!DOCTYPE html> 
 <html>  
 <body>  
   
 <div id="view">  
 </div>  
 <script>  
 var text="";  
 var index;  
 var buah = ["Apel", "Jeruk", "Nangka"];  
   
 for    (index = 0; index < buah.length; index++) {  
   text += index + " -> " +buah[index]+"<br/>";  
 }  
 document.getElementById("view").innerHTML = text;  
 </script>  
   
 </body>  
 </html>  

Array Assosiatif pada Javascript

Array assosiatif adalah array dengan indeks string. Karena javascript tidak mendukung array assosiatif maka deklarasi array assosiatif akan dianggap sebagai object bukan sebagai array.

Untuk lebih jelas perhatikan contoh berikut ini:
var siswa = [];
siswa["nama"] = "Sabrina";
siswa["alamat"] = "jepara";
siswa["umur"] = 14;
var x = siswa.length;         // akan menghasilkan 0
var y = siswa[0];             // akan menghasilkan undefined

Lihat indeks artikel Tutorial Javascript Dasar >> 

Referensi :

0 komentar

Post a Comment