Materi

Javascript

A. Tujuan :
1. Siswa memahami tentang struktur javascript
2. Siswa memahami tentang pemrograman di javascript
3. Siswa memahami tentang pemakaian obyek dan form

B. Tentang JavaScript
Javascript adalah bahasa script yang diletakkan pada kode HTML dan
diproses pada sisi klien. Dengan adanya bahasa ini, kemampuan dokumen
HTML menjadi semakin luas. Sebagai contoh, dengan menggunakan
JavaScript dimungkinkan untuk memvalidasi masukan - masukan pada
formulir sebelum formulir dikirimkan ke server.
Javascript bukanlah bahasa Java dan merupakan dua bahasa yang berbeda.
Javascript diinterpretasikan oleh klien (codenya bisa dilihat pada sisi klien),
sedangkan kode Java dikompilasi oleh pemrogram dan hasil kompilasi yang
dijalankan oleh clien.

C. Struktur JavaScript
Struktur dari JavaScript adalah sbb :
<Script Language = ”JavaScript”>
<!- -
Penulisan kode javascript
// - - >
</Script>

Keterangan :
Kode <!-- // -- > umumnya disertakan dengan tujuan agar sekiranya
browser tidak mengenali JavaScript maka browser akan memperlakukannya
sebagai komentar sehingga tidak ditampilkan pada jendela browser.

D. JavaScript sebagai bahasa berorientasi pada obyek Properti

Properti adalah atribut dari sebuah objek. Contoh, objek mobil punya properti
warna mobil. Penulisan :
Nama_objek.nama_properti = nilai
window.defaultStatus = ”Selamat Belajar JavaScript”;

Metode
Metode adalah suatu kumpulan kode yang digunakan untuk melakukan sesuatu
tindakan terhadap objek.
Penulisan :
Nama_objek.nama_metode(parameter)
document.write (”Hallo”)

Modul JavaScript Guru Matpel Produktif RPL

E. Letak JavaScript dalam HTML
Skrip Javascript dalam dokumen HTML dapat diletakkan pada :
a. Bagian Head
b. Bagian Body (jarang digunakan).

Latihan
A. Dasar-Dasar Javascript
1. Pemakaian alert sebagai property window, ketikan dan berikan nama latihan1.html.

2. Pemakaian metode dalam objek, ketikan dan berikan nama latihan2.html.

3. Pemakaian prompt, ketikan dan berikan nama latihan3.html.

Modul JavaScript Guru Matpel Produktif RPL

 4. Pembuatan fungsi dan cara pemanggilannya, ketikan dan berikan nama
latihan4.html.

B. Dasar-Dasar Pemrograman di Javascript

1. Operasi dasar aritmatika, ketikan dan berikan nama aritmatika.html.

Modul JavaScript Guru Matpel Produktif RPL

 2. Operasi relational, ketikan dan berikan nama operasirelasional.html.

3. Seleksi kondisi (if..else), ketikan dan berikan nama KondisiIfElse.html.

Modul JavaScript Guru Matpel Produktif RPL

 4. Penggunaan operator switch untuk seleksi kondisi, ketikan dan berikan nama
KondisiSwitch.html.

5. Pemakaian looping < for >, ketikan dan berikan nama Loopingfor.html.

Modul JavaScript Guru Matpel Produktif RPL

 6. Pemakaian looping < do..while >, ketikan dan berikan nama
LoopingDoWhile.html.

Modul JavaScript Guru Matpel Produktif RPL

C. Pembuatan Form
1. Form input

2. Form button

Modul JavaScript Guru Matpel Produktif RPL

D. Tugas Praktikum

1. Buat halaman html untuk mengkonversi nilai angka menjadi nilai huruf dengan
menggunakan javascript (contoh seperti C.1.)

Konversi :
Nilai Keterangan
93-100 A
83-92 B
75-82 C
50-74 D
0-49 E

2. Buat halaman html untuk menampilkan aplikasi program kalkulator sederhana dengan
menggunakan javascript.

Contoh tampilan :

Bil 1 dan Bil 2 merupakan text box, dapat diisi angka, bila tombol + atau – atau
x atau / ditekan, maka akan keluar bilangan pada text box hasil, dimana
bilangan ini merupakan operasi arithmetik sesuai dengan tombol yang ditekan.

--- Selamat Belajar ---

--- Selamat Berkreasi ---

Modul JavaScript Guru Matpel Produktif RPL