merancang website dengan JAVA SCRIPT.ppt

X
1
Perancangan Web
Oleh : Moh. Sulhan, S.T., M.Kom
By : MOH.SULHAN,S.T., M.Kom

X
2
Perancangan Web
 Diperkenalkan pertama kali Netscape pada tahun 1995
 Awalnya dinamakan “LiveScript” sebagai bahasa sederhana yang
digunakan untuk browser Netscape Navigator 2
 Kemudian Netscape kerja sama dengan SUN Microsystem 
menjadi JAVASCRIPT
 Kemudian pada 4 desember Microsoft mengadaptasi teknologi tsb
dengan sebutan Jscript pada browser Explorer 3
Sejarah JavaScript

X
3
Perancangan Web
 Suatu Script yang berjalan secara client site yang disisipkan pada
dokumen HTML
 Bahasa pemrograman yang dapat memberikan kemampuan
tambahan terhadap bahasa HTML
 Tidak memerlukan Kompilator
 JavaScript bersifat Case Sensitive
 Sintaks penulisan Javascript memiliki kemiripan dengan bahasa
pemrograman Java dan Juga C
 Javascript dikembangakan Netscape disebut Web Script
 Javascript dikembangakan Sun Microsystems disebut applet
JavaScript?

X
4
Perancangan Web
Teks Editor
Digunakan untuk menuliskan kode-kode Java Script, teks editor yang dapat
digunakan antara lain notepad, dreamweaver, dll.
Web Browser
Digunakan untuk menampilkan halaman web yang mengandung kode-kode
Java Script. Web browser yang digunakan harus mendukung Java Srcipt.
Browser yang dapat digunakan adalah internet explorer dan Netscape
Navigator, dll.
Keperluan JavaScript
Untuk mempelajari pemrograman Java Script, ada dua piranti yang
diperlukan, yaitu :

X
5
Perancangan Web
Penulisan JavaScript
 Java script ditulis pada file yang sama
<SCRIPT LANGUANGE =”JavaScript” >
program java script disini
</SCRIPT>.
 Javascript ditulis pada file terpisah
<SCRIPT SRC=”namafile.js”></SCRIPT>
File javascript yang dibuat
terpisah

X
6
Perancangan Web
Penulisan Skrip pd File yang sama
<HTML>
<BODY>
<SCRIPT
language="JavaScript">
document.write("Belajar
Pemrograman Javascript!");
</SCRIPT>
</BODY>
</HTML>

X
7
Perancangan Web
Penulisan Skrip pd File terpisah
document.write("Skrip JAVASCRIPT pada File Terpisah");
File javascript : isi.js
<HTML>
<BODY>
<B>Contoh ini menggunakan
Javascript yang diambil dari File
lain..</B>
<SCRIPT language="JavaScript"
SRC="isi.js"></SCRIPT>
</BODY>
</HTML>
Dokumen HTML : lat2.html

X
8
Perancangan Web
 Write : digunakan untuk menuliskan teks tanpa ganti baris :
document.write(“Cara Penulisan Teks dengan Write”);
 Writeln : digunakan untuk menuliskan teks dengan ganti baris :
document.writeln(" Cara Penulisan Teks dengan Write ");
Penulisan Teks
Objek document mempunyai dua metode untuk menuliskan teks, yaitu
Untuk penulisan Komentar :
// ini komentar
atau
/* ini juga komentar */

X
9
Perancangan Web
Penulisan Skrip pd File terpisah
document.writeln("<PRE>");
document.write("<B><FONT SIZE=5>");
document.writeln("SELAMAT DATANG DI
JAVASCRIPT");
document.write("</B></FONT>");
document.write("<I>");
document.writeln("Program ini merupakan contoh
sederhana menampilkan Teks!");
document.write("</I>");
document.writeln("Dengan Javascript!!!!!!!!");
File javascript : isi3.js
<HTML>
<BODY>
<B>Contoh ini menggunakan Javascript yang
diambil dari File lain..</B>
<SCRIPT language="JavaScript"
SRC="isi3.js"></SCRIPT>
</BODY>
</HTML>
Dokumen HTML : lat3.html

X
10
Perancangan Web
| Variabel | Tipe Data |
Operator |

X
11
Perancangan Web
 Variabel adalah tempat dimana kita menyimpan nilai-nilai atau
informasi-informasi pada JavaScript
 Variabel yang dideklarasikan dapat di isi dengan nilai berupa
huruf, angka, dll.
 Jika anda memberi nilai pada variabel, maka dalam JavaScript
dianggap bahwa anda telah mendeklarasikan variabel tersebut.
Variabel Dalam JavaScript
Aturan Penamaan Variael
 Harus diawalai dengan karakter huruf
 Tidak boleh menggunakan spasi.
 Tidak boleh menggunakan kata-kata yang merupakan perintah
dalamJavaScript.

X
12
Perancangan Web
Variabel Dalam JavaScript
Var nama_variabel = nilai
Atau
Nama_variabel = nilai
var nama = ”Zaskia Mecca”;
var X = 1998;
Nama = ”Bunga Lestari”;
X = 1990;
Y = 08170223513;
Contoh :

X
13
Perancangan Web
Tipe Data Dalam JavaScript
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

X
14
Perancangan Web
Tipe Data : Numerik
Pada dasarnya JavaScript hanya mengenal dua macam tipe numerik, yaitu
bilangan bulat (integer) dan bilangan pecahan(real/float).
var A = 100;
var a = 3.14533567;
var b = 1.23456E+3;
Tipe Data : String
Untuk mendeklarasikan tipe string dapat dilakukan dengan cara menuliskan
string diantara tanda petik tunggal (’) atau tanda petik ganda (”)
var str =’Contoh deklarasi string’;
var str1 = ”cara ini juga bisa untuk menulis string”;

X
15
Perancangan Web
Tipe Data : Boolean
Tipe boolean hanya mempunyai nilai True atau False. Tipe ini biasanya
digunakan untuk mengecek suatu kondisi atau keadaan
Tipe Data : Null
Tipe Null digunakan untuk merepresentasikan variabel yang tidak diberi nilai
awal (inisialisasi).
var X = (Y > 90);
contoh di atas menunjukkan bahwa jika Y lebih besar dari 90 maka X
akan bernilai True.

X
16
Perancangan Web
Operator Dalam JavaScript
Operator pada JavaScript terbagi menjadi empat, yaitu :
• Aritmatika
• Pembanding
• Logika
• String

X
17
Perancangan Web
Operator Aritmatika
Operator Keterangan
+ Penjumlahan
- Pengurangan
* Perkalian
/ Pembagian
% Modulus

X
18
Perancangan Web
Operator Pembanding
Operator Keterangan
== Sama dengan
!= Tidak sama dengan
> Lebih besar
< Lebih kecil
>= Lebih besar atau sama dengan
<= Lebih kecil atau sama dengan

X
19
Perancangan Web
Operator Logika
Operator Keterangan
&& Operator logika AND
|| Operator logika OR
! Operator logika NOT

X
20
Perancangan Web
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
nama = ”Java” + ”Script”;
akan menghasilkan ”JavaScript” pada variabel nama
Contoh :

X
21
Perancangan Web
Percabangan Dalam JavaScript
• Untuk membuat suatu halaman yang dinamis dan interaktif, perancang
halaman Web membutuhkan perintah-perintah yang dapat mengatur aliran
dari informasi.
• Berdasarkan hasil komputasi yang telah dilakukan, JavaScript akan
membuat keputusan jalur mana yang akan dieksekusi.
• Pada dasarnya dalam JavaScript terdapat dua macam pernyataan
percabangan yaitu if..else dan switch

X
22
Perancangan Web
Percabangan IF..Else
If (kondisi1)
{
//pernyataan1 dieksekusi
//bila kondisi1 terpenuhi
}
else if (kondisi2)
{
//bila kodisi1 tidak terpenuhi
}
else
{
//bila kodisi2 tidak terpenuhi
}

X
23
Perancangan Web
Switch
Selain menggunakan if..else, percabangan juga dapat ditangani dengan
perintah switch. Dengn kata lain pernyataan switch digunakan untuk
menyederhanakan pernyataan if..else yang terlalu banyak.
Switch (kondisi)
{
case (pilihan kondisi) : pernyataaan 1
}

X
23
Perancangan Web
Contoh : Switch
<html>
<body>
<script>
var minuman = "Kopi";
switch(minuman){
case "Teh Manis":
document.write("Tadi pagi saya minum Teh Manis");
break;
case "Kopi":
document.write("Tadi pagi saya minum Kopi");
break;
case "Susu":
document.write("Tadi pagi saya minum Susu");
break;
case "Jus Jeruk":
document.write("Tadi pagi saya minum Jus Jeruk");
break;
}
</script>
</body>
</html>

X
24
Perancangan Web
Pengulangan Dalam JavaScript
• Untuk mengulang kejadian beberapa kali maka kita membutuhkan proses
perulangan.
• Pada JavaScript dikenal beberapa metode/cara perulangan.
- FOR
- While
- Do While

X
25
Perancangan Web
For
for (nilai awal;kondisi;penambahan)
{
ulang pernyataan ini;
}
Contoh dalam program :
For(x=1;x<=10;x++)
{
document.writeln(”Belajar JavaScript Yoo..”);
}

X
17
Perancangan Web
While
while (kondisi)
{
ulang pernyataan ini;
}
Contoh : Do While
var a=1
while(a<=4){
document.write("ini blok ke "+a)
a++
}

X
17
Perancangan Web
Contoh : Do While
m = 1
do {
document.write("Ini pengulangan ke "+m+"<br>")
m++
}while(m<=4)
Do While
Do
{
/pernyataan1 dieksekusi
}
while (kondisi);

X
12
Perancangan Web
Oleh : Moh. Sulhan, S.T., M.Kom

merancang website dengan JAVA SCRIPT.ppt

More Related Content

Similar to merancang website dengan JAVA SCRIPT.ppt (20)

More from Sulhandrive (15)

Recently uploaded (8)

merancang website dengan JAVA SCRIPT.ppt