MODUL
PRAKTIKUM APLIKASI
(JAVA SCRIPT)
OGI MUHAMAD RAMADHAN, [Link]
SMK KARTINI BATAM
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 1
MODUL
PENDAHULUAN
1.1 Pengantar
Javascript diperkenalkan pertama kali oleh Netscape pada tahun 1995. Pada awalnya
bahasa ini dinamakan “LiveScript” yang berfungsi sebagai bahasa sederhana untuk
browser Netscape Navigator 2. Pada masa itu bahasa ini banyak di kritik karena kurang
aman, pengembangannya yang terkesan buru buru dan tidak ada pesan kesalahan yang
di tampilkan setiap kali kita membuat kesalahan pada saat menyusun suatu program.
Kemudian sejalan dengan sedang giatnya kerjasama antara Netscape dan Sun
(pengembang bahasa pemrograman “Java” ) pada masa itu, maka Netscape
memberikan nama “JavaScript” kepada bahasa tersebut pada tanggal 4 desember 1995.
Pada saat yang bersamaan Microsoft sendiri mencoba untuk mengadaptasikan
teknologi ini yang mereka sebut sebagai “Jscript” di browser Internet Explorer 3.
Javascript adalah bahasa yang berbentuk kumpulan skrip yang pada fungsinya berjalan
pada suatu dokumen HTML, sepanjang sejarah internet bahasa ini adalah bahasa skrip
pertama untuk web. Bahasa ini adalah bahasa pemrograman untuk memberikan
kemampuan tambahan terhadap bahasa HTML dengan mengijinkan pengeksekusian
perintah perintah di sisi user, yang artinya di sisi browser bukan di sisi server web.
Javascript bergantung kepada browser(navigator) yang memanggil halaman web yang
berisi skrip skrip dari Javascript dan tentu saja terselip di dalam dokumen HTML.
Javascript juga tidak memerlukan kompilator atau penterjemah khusus untuk
menjalankannya (pada kenyataannya kompilator Javascript sendiri sudah termasuk di
dalam browser tersebut). Lain halnya dengan bahasa “Java” (dengan mana JavaScript
selalu di banding bandingkan) yang memerlukan kompilator khusus untuk
menterjemahkannya di sisi user/klien.
1.2 Keperluan Java Script
Untuk mempelajari pemrograman Java Script, ada dua piranti yang diperlukan, yaitu :
a. Teks Editor
Digunakan untuk menuliskan kode-kode Java Script, teks editor yang
dapat digunakan antara lain notepad dan ultra edit.
b. Web Browser
Digunakan untuk menampilkan halaman web yang mengandung kode-kode Java
Script. Web browser yang digunakan harus mendukung Java Srcipt.
Menggunakan Tag pada HTML
Beberapa contoh penggunaan tag HTML,
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 2
Ada beberapa tag yang memilki atribut didalamnya, seperti tag <font>, <table>, <input>
dan sebagainya. Pada tag font ia memiliki beberapa atribut diantaranya atribut: color, size,
face. Untuk lebih memahami atribut lihatlah contoh berikut ini.
<font color=”red” face=”Arial” size=”12”>Ini Font Arial berwarna merah dan
berukuran 12 pt</font> hasil -> Ini Font Arial berwarna merah dan berukuran 12 pt
ƒ Atribut color digunakan untuk menentukan warna tulisan.
ƒ Atribut face digunakan untuk menentukan jenis huruf.
ƒ Atribut size digunakan untuk menentukan ukuran huruf.
Jika anda lihat bahwa atribut color berada pada awal, lalu yang kedua adalah face dan yang
terakhir adalah size. Anda tidak perlumemperdulikan urutan atribut tersebut karena
browser hanya membaca isi dari properi bukan urutan atributnya.
Daftar Tag pada HTML
Berikut ini adalah tabel tag-tag HTML dan fungsinya:
Tag Utama
Modifikasi Teks
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 3
Font
Link
Gambar
Formatting
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 4
Tabel
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 5
Form
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 6
1.3 Penulisan Java Script
Kode Java Script dituliskan pada file [Link] dua cara untuk menuliskan
kode-kode Java Script agar dapat ditampilkan pada halaman HTML, yaitu :
a. Java script ditulis pada file yang sama
Untuk penulisan dengan cara ini, perintah yang digunakan adalah
<SCRIPT LANGUANGE=”JavaScript” >program java scrip disini</SCRIPT>.
Perintah tersebut biasanya diletakkan :
1. Bagian Head
2. Bagian Body (jarang digunakan).
<HTML>
<HEAD><TITLE>……….</TITLE>
</HEAD>
<SCRIPT LANGUAGE=”Javascript”>
kode javascript disini
</SCRIPT>
<BODY>
kode HTML
disini </BODY>
</HTML>
b. Javascript ditulis pada file terpisah
Kode Javascript bisa juga kita buat dalam file terpisah dengan tujuan agar dokumen
HTML isinya tidak terlalu panjang. Atribut yang digunakan adalah:
<SCRIPT SRC=”[Link]”>…</SCRIPT>
Diantara tag <SCRIPT………> dan <SCRIPT> tidak diperlukan lagi kode
Javascriptnya karena sudah dibuat dalam file terpisah. File yang mengandung kode
Javascript berekstensi .js
1.4 Program Pertama Javascript
Pada bagian ini kita akan membuat program dengan menggunakan Javascript. Program ini
akan menampilkan teks “ Belajar Pemrograman Javascript”
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 7
Berikut diberikan beberapa contoh program sederhana dengan menggunakan Javascript :
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 8
File [Link] ( save dengan nama [Link])
File HTML
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 9
1.5 Komentar
Sama seperti bahasa pemrograman lain. Javascript juga menyediakan fasilitas untuk
menuliskan komentar, komentar ini berguna bila nantinya anda atau orang lain membaca
program. Pemberian komentar dalam Javascript dapat dilakukan dengan dua cara yaitu
dengan menuliskan komentar setelah tanda garis miring dua kali, contoh :
//ini komentar
atau
/*ini juga komentar */
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 10
MODUL
2
VARIABEL JAVASCRIPT
2.1. Variabel Dalam JavaScript
Variabel adalah empat dimana kita menyimpan nilai-nilai atau informasi-informasi
pada JavaScript. Variabel yang dideklarasikan dapat di isi dengan nilai apa saja. Dalam
JavaScript pendeklarasian sebuah variabel sifatnya opsional, artinya anda boleh
mendeklarasikan atau tidak hal tersebut tidak menjadi masalah. Jika anda memberi nilai
pada variabel, maka dalam JavaScript dianggap bahwa anda telah mendeklarasikan
variabel tersebut.
Aturan penamaan variabel :
▪
Harus diawalai dengan karakter (huruf atau baris bawah)
▪
Tidak boleh menggunakan spasi
▪
Huruf Kapital dan kecil memiliki arti yang berbeda
▪
Tidak boleh menggunakan kata-kata yang merupakan perintah dalam
JavaScript.
Deklarasi Variabel
Var nama_variabel = nilai
Atau
Nama_variabel = nilai
Contoh :
var nama; Nama = ”Bunga Lestari”
var nama = ” Zaskia Mecca” X = 1990;
var X = 1998; Y = 081315235163
var Y;
2.2. Tipe Data
Tidak seperti bahasa pemrograman lainnya, JavaScript tidak memiliki tipe data secara
explisit. Hal ini dapat dilihat dari beberapa contoh variabel diatas. Anda mendeklarasikan
variabel tapi tidak menentukan tipenya. Meskipun JavaScript tidak memiliki tipe data
secara explisit. JavaScript mempunyai tipe data implisit. Terdapat empat macam tipe data
implisit yang dimiliki oleh JavaScript yaitu :
▪
Numerik, seperti : 0222532531, 1000, 45, 3.146789 dsb
▪
String, seperti : “Hallo”, “April”, “Jl. Setiabudi No 17A”, “Cece Kirani” dsb
▪
Boolean, bernilai true atau false
▪
Null, variabel yang tidak diinisilisasi
2.3. Tipe Numerik
Pada dasarnya JavaScript hanya mengenal dua macam tipe numerik, yaitu bilangan bulat
(integer) dan bilangan pecahan(real/float). Untuk bilangan bulat, kita dapat
merepresentasikan dengan basis desimal, oktal atau heksadesimal. Contoh :
var A = 100;
var B = 0x2F;
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 11
untuk pendeklarasian tipe bilangan real, dapat menggunakan tanda titik atau notasi ilmiah
(notasi E).
Contoh :
var a = 3.14533567;
var b = 1.23456E+3;
2.4. Tipe String
Untuk mendeklarasikan tipe string dapat dilakukan dengan cara menuliskan string diantara
tanda petik tunggal (‟) atau tanda petik ganda (”)
Contoh :
var str =‟Contoh deklarasi string‟;
var str1 = ”cara ini juga bisa untuk menulis string”;
2.5. Tipe Boolean
Tipe boolean hanya mempunyai nilai True atau False. Tipe ini biasanya digunakan
untuk mengecek suatu kondisi atau keadaan. Contoh :
var X = (Y > 90);
contoh diatas menunjukkan bahwa jika Y lebih besar dari 90 maka X akan bernilai True.
2.6. Tipe Null
Tipe Null digunakan untuk merepresentasikan variabel yang tidak diberi nilai awal
(inisialisasi).
2.7. Operator
Operator pada JavaScript terbagi menjadi enam, yaitu :
• Aritmatika
• Pemberian nilai (Assign)
• Pemanipulasian bit (bitwise)
• Pembanding
• Logika
• String
a. Operator Aritmatika
Digunakan untuk operan beripe numerik. Ada dua macam operator aritmatik,
yaituoperator numerik tunggal dan operator aritmatik biner. Perbedaan kedua
operator terletak pada jumlah operan yang harus dioperasikan.
Operator Tunggal/Biner Keterangan
+ Biner Penjumlahan
- Biner Pengurangan
* Biner Perkalian
/ Biner Pembagian
% Biner Modulus
- Tunggal Negasi
++ Tunggal Penambahan dengan satu
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 12
-- Tunggal Pengurangan dengan satu
b. Operator Pemberian Nilai
Digunakan untuk memberikan nilai ke suatu operan atau mengubah nilai
suatu operan.
Operator keterangan Contoh Ekuivalen
= Sama dengan X=Y
+= Ditambah dengan X+=Y X=X+Y
-= Dikurangi dengan X-=Y X=X-Y
*= Dikali dengan X*=Y X=X*Y
/= Dibagi dengan X/=Y X=X/Y
%= Modulus dengan X%=Y X=X%Y
&= Bit AND dengan X&Y X=X&Y
|= Bit OR X|=Y X=X|Y
c. Operator Manipulasi Bit
Operasi ini berhubungan dengan pemanipulasian bit pada operan bertipe
bilangan bulat.
Operator Keterangan
& Bit AND
| Bit OR
^ Bit XOR
~ Bit NOT
<< Geser ke kiri
>> Geser ke Kanan
>>> Geser ke kanan dengan diisi nol
Contoh :
var A = 12; // A = 1100b
var B = 10; // B = 1010b
var C = A & B
maka akan dihasilkan bilangan seperti berikut :
1100b
1010b AND
1000b
var A = 12;
var C = A<< 2
var D = A >> 1
maka variabel C akan bernilai 48(0011 0000b)
variabel D akan bernilai 6 (0110b)
d. Operator Pembanding
Digunakan untuk membandingkan dua buah operan. Operan yang dikenal operator
ini dapat bertipe string, numerik, maupun ekspresi lain.
Operator Keterangan
== Sama dengan
!= Tidak sama dengan
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 13
> Lebih besar
< Lebih kecil
>= Lebih besar atau sama dengan
<= Lebih kecil atau sama dengan
e. Operator Logika
Digunakan untuk mengoperasikan operan yang bertipe boolean.
Operator Keterangan
&& Operator logika AND
|| Operator Logika OR
! Operator logika NOT
Contoh :
var A = true;
var B = false;
var C = A && B; //menghasilkan false
var D = A || B ; // false
var E = !A; //false
f. Operator String
Selain operator pembanding, operator string pada JavaScript juga mengenal satu
operator lagi yang bernama PENGGABUNGAN. Operator ini digunakan untuk
menggabungkan beberapa string menjadi sebuah string yang lebih panjang.
Contoh :
nama = ”Java” + ”Script”;
akan menghasilkan ”JavaScript” pada variabel nama
Contoh Program JavaScript
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 14
Memasukkan Data
Untuk memasukkan data dari keyboard dapat dilakukan dengan menggunakan perintah
input.
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 15
Con
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 16
TUGAS !
SILAHKAN BUAT LAPORAN DALAM FORMAT
MS. WORD
Progdas (JavaScript) – Create by : Ogi Muhamad Ramadhan. [Link] Page 17