Materi Pokok
- Pengenalan JavaScript
- Cara meletakan kode JavaScript
- Cara memeriksa kesalahan
- Cara membuat fungsi
- Aturan penamaan variabel
- Perintah if dan switch
- Perintah while, do.. while, dan for
- Array
- jQuery
- Penanganan kejadian dengan jQuery
- Berbagai pustaka di jQuery
1. Bisakah dijelaskan tentang JavaScript?
2. Dimana saja Kode JavaScript bisa dituliskan?
<html>
<head>
<title>Contoh Java Script</title>
<script type=”text/javascript”>
window.onload = init;
function init() {
var elemenInfo = document.getElementById(“info”);
var teks = “Well, saya dibangkitkan oleh JavaScript”;
elemenInfo.innerHTML = teks;
}
</script>
</head>
<body>
<h1>Contoh HTML, PHP, dan JavaScript</h1>
<div>Tulisan ini berasal dari kode HTML</div>
<?php
print(“Tulisan ini dibangkitkan oleh PHP”);
?>
<div id=”info”></div>
</body>
</html>
pada dokumen diatas, kode
menyatakan kode JavaScript. Hal ini ditandai dengan <script type=”text/javascript”> dan di akhiri </script> Kode tersebut terletak di dalam tag <head> dan </head> setelah pasangan <title> dan </title>.
Pernyataan
window.onload = init;
menyatakan bahwa kalau seluruh elemen di HTML sudah termuat di halaman web ( dinyatakan dengan atribut onload pada window), fungsi init akan dijalankan. Sementara definisi fungsi init adalah sebagai beriukut:
function init() {
…
}
Pernyataan
var elemenInfo = document.getElementById(“info”);
digunakan untuk membuat variabel elemenInfo agar merujuk ke elemen HTML yang ber ID “info”. Elemen yang dimaksud adalah :
<div id =”info”</div>
dalam hal ini, var digunakan untuk mendeklarasikan variabel. Pernyataan
var teks = “well, saya dibangkitkan oleh JavaScript’;
digunkan untuk mendeklarasikan variabel teks dan diisi dengan string:
“well, saya dibangkitkan oleh JavaScript”
Selanjutnya ,
elemenInfo.innerHTML = teks;
digunakan untuk mengisikan variabel teks ke bagian elemen yang dirujuk oleh elemenInfo. Dalam hal ini, innerHTML adalah properti milik elemen tersebut yang menyatakan isi elemen. Hasil pemanggilan jscript.php seperti berikut:
JavaScript |
Hal yang serupa, khususnya yang dibangkitkan oleh JavaScript, bisa ditulis menjadi seperti berikut:
<html>
<head>
<title>Contoh Java Script</title>
</head>
<body>
<h1>Contoh HTML, PHP, dan JavaScript</h1>
<div>Tulisan ini berasal dari kode HTML</div>
<?php
print(“Tulisan ini dibangkitkan oleh PHP”);
?>
<div id=”info”>
<script type=”text/javascript”>
document.write(“Well, saya dibangkitkan oleh JavaScript”);
</script>
</div>
</body>
</html>
Perhatikan bahwa kode JavaScript diletakan di dalam pasangan tag <div> dan </div> yang berada di body. selain itu, penampilan string dilakukan melalui document.write () dan tidak perlu ada rujukan ke elemen HTML karena kode sudah berada di elemen bersangkutan yaitu <div>.
Kode JavaScript sering juga diletakan di file yang terpisah dengan file yang berisi kode HTML. Pada keadaan seperti ini, kode javaScript disimpan di file berekstensi .js. sebagai contoh, perhatikan file berikut:
function init() {
var elemenInfo = document.getElementById(“info”);
var teks = “well, saya dibangkitkan oleh JavaScript”;
elemenInfo.innerHTML = teks;
}
Penggunaan kode di atas dapat dilihat di dokumen berikut:
<html>
<head>
<title>Contoh Java Script</title>
<script type=”text/javascript” src=”contoh.js”></script>
</head>
<body>
<h1>Contoh HTML, PHP, dan JavaScript</h1>
<div>Tulisan ini berasal dari kode HTML</div>
<?php
print(“Tulisan ini dibangkitkan oleh PHP”);
?>
<div id=”info”></div>
</body>
</html>
Hasilnya akan sama seperti jscript.php
CATATAN
- Pernyataan di JavaScript sebenarnya tidak harus di akhiri dengan titik komasepanjang di baris tempat pernyataan tersebut berada hanya berisi satu pernyataan. Namun dianjurkan untuk tetap menyertakan titik koma di akhir pernyataan.
- Di JavaScript, tanda petik ganda (“) yang mengapit string boleh digantikan dengan tanda petik tunggal (‘).
3. Bagaimana caranya mengetahui kode JavaScript yang salah?
Jika kamu menggunakan browser Google Chrome, kamu bisa memonitor kesalahan kode JavaScript dengan menekan tombol Ctrl+Shift+J terlebih dahulu. Untuk memahami hal ini, cobalah untuk menuliskan dokumen seperti berikut:
<html>
<head>
<title>Contoh Java Script</title>
</head>
<body>
<script type=”text/javascript”>
document.writ(“Apakah Anda melihat tulisan ini”);
</script>
</body>
</html>
Perhatikan , document.write sengaja ditulis menjadi document.writ ( tanpa e). Lalu panggilah di browser. Hasilnya, halaman web dalam keadaan kosong, seperti terlihat di bawah ini.
ujisalah |
Sekarang, cobalah menekan tombol ctrl+shift+j!. Kamu akan menjumpai hasil seperti berikut:
tampilan kesalahan |
Pesan kesalahan terpenting terletak pada baris pertama, yang menyatakan bahwa metode writ tidak dikenal. Sekarang, cobalah untuk menambahkan e setelah write. simpan dokumen dan panggil kembali di browser. Hasilnya seperti berikut:
Tampilan uji kesalahan |
- Pesan lain diabaikan saja karena tidak ada hubungan dengan kode yang kamu tulis.
- Pada Firefox, Error Console ( jendela yang berisi pesan kesalahan) diaktifkan dengan menggunakan Ctrl+Shift+J
- Untuk menghapus pesan terdahulu, kliklah pada Clear.
4. Bagaimana cara membuat fungsi di JavaScript?
Bentuk definisi fungsi adalah sebagai berikut:
function nama (daftar_argumen) {
pernyataan_1;
…
pernyataan_2;
}
Pernyataan return di gunakan untuk memberikan nilai balik fungsi. kala nilai balik tidak diperlukan maka tidak perlu ada return. Pada contoh di atas
function init() {
var elemenInfo = document.getElementById(“info”);
var teks = “well, saya dibangkitkan oleh JavaScript”;
elemenInfo.innerHTML = teks;
}
Pada contoh kode di atas tidak mengandung return.
Di fungsi, variabel yang dideklarasikan sebagai var berlaku sebagai variabel lokal. Jika variabel di fungsi tidak dideklarasikan dengan var, variabel tersebutbersifat gelobal. Oleh karena itu, harus hati-hati untuk tidak menggunakan var karena bisa mempengaruhi variabel diluar fungsi. Efek variabel global dapat kamu lihat di contoh berikut:
<html>
<head>
<title>Efek Variabel Global</title>
</head>
<body>
<h1>Efek Variabel</h1>
<script type=”text/javascript”>
var mobil = “Toyota Avanza”;
document.write(“Sebelum pemanggilan fungsi: ” +
mobil + “<br>”);
ubahData();
document.write(“Setelah pemanggilan fungsi: ” +
mobil + “<br>”);
function ubahData() {
mobil = “Honda Jazz”;
}
</script>
</body>
</html>
hasilnya seperti berikut:
Hasil Efek Variabel |
mobil = “Honda Jazz”;
menjadi
var mobil = “Honda Jazz”;
hasilnya menjadi seperti berikut
Efek variabel global |
5. Apakah di JavaScript ada perintah untuk membuat komentar?
6. Apakah Variabel di JavaScript mempunyai aturan sama dengan di PHP?
- Variabel di JavaScript bisa ditulis dengan mengikuti aturan punak unta. Nama variabel ditulis dengan awalan berupa huruf kecil. Kalau nama variabel mengandung dua kata atau lebih, huruf awal kata kedua dan seterusnya ditulis dengan huruf kapital. Contoh hargaMobil, nilaiUjianTerakhir.
Hal terpenting lainnya, variabel di JavaScript dideklarasikan menggunakan kata var. Contoh:
var teks;
Saat pendeklarasian, variabel bisa diberi nilai sekaligus. Contoh:
var teks = “well, saya dibangkitnkan oleh JavaScript”;
7. Operator apa saja yang disediakan di JavaScript?
OPERATOR
|
PRIORITAS
|
KETERANGAN
|
CONTOH
|
HASIL
|
*
|
3
|
Perkalian
|
2*4
|
8
|
/
|
2
|
Pembagian
|
6/3
|
2
|
%
|
3
|
Sisa Pembagian
|
7%2
|
1
|
+(unary)
|
2
|
Tanda Positif
|
+6
|
6
|
(-unary)
|
2
|
Tanda Negatif
|
+7
|
-7
|
+
|
4
|
Penjumlahan
|
2+3
|
5
|
–
|
4
|
Pengurangan
|
4-1
|
3
|
++
|
1
|
Naikan Nilai Sebesar Satu
|
a=1;
|
a berisi 2
|
—
|
1
|
Pengurangan Nilai Satu
|
a=1;
|
a berisi 0
|
- Unary berarti bahwa operator melibatkan satu operand. Adapun operator binary adalah operator yang melibatkan dua operand.
- Prioritas menentukan urutan pengerjaan ekspresi. Operator yang mempunyai prioritas lebih tinggi akan dikerjakan lebih dahulu daripada operator yang prioritasnya lebih rendah. Contoh: 6+2*3 akan menghasilkan 12, karena 2*3 akan diproses terlebih dahulu. Hasilnya baru dijumlahkan dengan 6.
Tunggu Pembahasan Selanjutnya ya Bro
Jika Kalian ingin belajar tentang HTML, JavaScript, PHP, dan Database silakan berkunjung ke blog Pemrograman disini banyak tutorial yang membahas tentang web pemrograman.
Wahh JavaScript yaa, saya pernah jg main ini pas buat web, seperti retina.js, dn itu sangat bagus sekali utk website menajdi lebih interaktif, haturnuhun ka (y/