Langsung ke konten utama

Haikal PG - XI RPL 1 - PWPB Sesi 13

Assalamualaikum Warahmatullahi Wabarokatuh
Pada pertemuan kali ini masih di Javascript, Kita akan masuk ke materi tentang array. Apa itu array? Bagaimana array bekerja? kita langsung saja mulai.

Definisi Array

  • Array, adalah satu variable yang dapat berisi banyak data yang independent. Data yang disimpan diberikan indeks tertentu atau menggunakan nomer urut mulai dari 0.
  • Indeks ini nantinya dapat kita gunakan untuk mengakses data yang disimpan dalam array tersebut.
Jenis-jenis array
  1. Array monodimensi
  • Array yang hanya berisikan nilai-nilai tunggal disebut sebagai array monodimensi.
  • Indeks ini akan diberikan secara otomatis oleh intepreter javascript, dimulai dari elemen/data pertama dengan indeks 0 Dalam suatu array dengan n elemen, maka elemen ke-n akan mempunyai indeks n-1.
      2.Array Multidimensi
  • Jika elemen suatu array berisikan array lainnya, maka array tersebut termasuk array multidimensi.
      3.Array Asosiatif
  • Indek dalam array selain ditentukan secara otomatis oleh sistem dan selalu dimulai dari 0, juga dapat dimodifikasi dengan menggunakan kata (string) atau nilai tertentu. Tabel dengan indeks termodifikasi ini kita kenal dengan nama array asosiatif.

BuatArray.html
Kita akan coba buat sebuah array dan kita isikan dengan sebuah string dengan nama-nama dan kita akan panggil salah satu indeks ke dalam tag HTML. Setelah kita panggil kita akan mengedit sebuah tampilanya agar lebih cantik menggunakan CSS yang akan kita gunakan untuk semua file yang akan kita buat kali ini. Tampilannya  dan kodnya: 

Bisa teman-teman lihat. kita telah membuat sebuah array dengan nama siswaXIRPL1 dengan cara memanggilanya dengan var siswaXIRPL1 = ["Indeks 0", "Indeks 1", "Indeks 2", "Indeks Ke-n"]; setelah kita membuat array kita akan memanggil indeks ke 4 yaitu "Lukman" seperti pada code diatas lalu tampilkan ke tag <p> yang memiliki id coba. Maka yang mucul adalah nama lukman.

BuatArray2.html
Sama seperti diatas kita akan memanggil sebuah nama yang ada pada array. Namun kali ini syntax penulisannya agak berbeda jika tapi seperti : var siswaXIRPL1 = ["Indeks 0", "Indeks 1", "Indeks 2", "Indeks Ke-n"]; sekarang menjadi var siswaXIRPL1 = new Array ("Indeks 0", "Indeks 1","Indeks 2","Indeks Ke-n");. Bisa teman-teman lihat, penulisannya sedikit berbeda namun kegunaanya sama yaitu untuk membuat array. Jadi teman-teman bisa pilih metode mana yang akan digunakan untuk pembuatan array. Tampilanya :


Kita buat code seperti diatas, lalu kita panggil sebuah indeks array ke 2.  Maka yang tampil adalah nama rajab.

ArrayAsObjek.html
Array juga bisa ditulis seperti ini var person = {firstname:"Mochamad", lastname:"Faisal", age:15}; dan pemanggilanya bukan dengan indeks nomor tapi dengan seperti ini : document.getElementById("objek").innerHTML = person ["firstname"];. Kita buat array seperti berikut :


Setelah membuat array seperti diatas kita bisa memanggilnya dengan person = ["firstname"]; atau bisa juga person = ["lastname"]; atau bisa juga kita memanggilnya hanya age/umurnya saja dengan person = ["age"];.

AksesDataonArray.html
Kita coba lagi membuat array namun kita akan memanggilnya dengan documen.write();. document.write ini untuk menampilkan ke page HTML. Kita coba buat array dengan berisikan nama-nama binatang dan kita akan tampilkan dengan document.write();. Hasilnya


Kita bisa memanggilnya bersama seperti diatas. Dan menghasilkan sebuah kumpulan kata-kata.


Bisa? atau bingung?. Hehe, kalo bingung teman-teman bisa comment apa yang membuat kalian bingung nanti kita coba solving masalah yang teman-teman berikan di comment. Yasudah sekian saja pada pertemuan kali ini, Wassalamualaikum Warahmatullahi Wabarokatuh.

Komentar

Postingan populer dari blog ini

Haikal PG - XI RPL 1 - PWPB Sesi 36

Assalamualaikum Warahmatullahi Wabarokatuh Halo teman-teman gimana kabarya? semoga sehat selalu ya.. . Pada sesi kali ini kita akan membahas tentang OOP (Object Oriented Programming) pada php. OOP merupakan konsep/metode programming berorientasi pada objek. Jadi didalam OOP semua digambarkan sebagai objek yang di representasikan. Terdiri dari 3 struktur diantaranya : Class, property, dan method/function. Ok kita langsung saja ke materinya. Coba teman-teman buat sebuah file bernama dan berekstensi seperti ini : HewanPeliharaan.php  nah disini kita akan membuat struktur class yang dimana hewan ini memiliki 3 property diantaranya nama, jenis, dan makanan. Untuk lebih jelasnya seperti ini: nama = $nama; $this->jenis = $jenis; $this->makanan = $makanan; } } Tag phpnya tidak perlu ditutup karena ini merupakan class dan kita tidak akan menambahkan code seperti html/js disini. __construct merupakan function yang ada di php, construct ini merupakan bagian code yang akan pertama...

Haikal PG - XI RPL 1 - PWPB Sesi 25

Assalamualaikum Warahmatullahi Wabarokatuh Kembali lagi dengan saya Haikal Putra Gustiansyah yang dimana pada sesi kali ini kita akan membahas array assosiatif dan media query. Array assosiatif merupakan sebuah tipe data yang memungkinkan kita menyimpan data yang memiliki tipe data yang berbeda bisa berupa string,numerik, dll. Media Query merupakan salah satu fitur CSS3 yang memungkinkan kita agar membuat halaman yang web yang responsif. Simak materi pada sesi kali ini. Array Asosiatif Array Asos iatif ad alah  array yang tidak menggunakan angka sebagai kunci di setiap nilainya. Jika tidak ditentukan kunci dari sebuah elemen di array, PHP akan otomatis memberikan kuncinya berupa angka. Perbedaanya hanya bagaimana kita mengakses data/elemen-elemen tersebut. Copykan code berikut: LatArrayAsosiatif.php 'Haikal', '1819117580' => 'Milyardin', '1819117581' => 'Steph~~'); echo $siswa['1819117579'] . ' '; ec...

Haikal PG - XI RPL 1 - PWPB Sesi 7

Assalamualaikum Warahmatullahi Wabarokatuh Kembali lagi dengan saya, disini saya akan membahas kembali tag-tag pada HTML. Pada HTML juga kita bisa menambahkan seperti audio, video, flash dengan tag yang akan saya bahas kali ini. Kita langsung saja mulai tutorialnya : Menambahkan Audio Di HTML kita bisa menambakan audio dengan tag <audio> </audio>. Seperti pada tag img kita juga harus memsukkan sumber lagu dengan attribut src="lagu.mp3". Ada juga attribut untuk memulai musik secara otomatis yaitu autoplay, Attribut untuk controls untuk menampilkan sebuah control spesifik audio, Attribut loop ini untuk mengulang lagu jika lagu sudah selesai. Berikut tampilannya jika di jalankan di browser : Tag audio html Codenya : Haikal Putra Gustiansyah XI RPL 1 Audio Menambahkan Video Selain menambahkan audio kita juga bisa menambahkan video dengan tag <video> </video> dan jangan lupa masukkan sumber video dengan src="". Attribut n...