Java Script
Java Script
PENDAHULUAN
1
1.2 Penulisan Pada Java Script
Kode Java Script dituliskan pada file HTML.Terdapat dua cara untuk
menuliskan kode-kode Java Script agar dapat ditampilkan pada halaman HTML,
yaitu :
A. Tipe Data
JavaScript tidak memiliki tipe data secara explisit. Meskipun JavaScript tidak
memiliki tipe data secara explisit. JavaScript mempunyai tipe data implisit.
Terdapat 4 macam tipe data implisit yang dimiliki oleh JavaScript
yaitu :
1.Numerik : 0222532531, 1000, 45, 3.146789
2.String : “Hallo”, “April”, “Jl. Setiabudi No 17A
2
3.Boolean : bernilai true atau false
4.Null : variabel yang tidak diinisilisasi
1. 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.
2. Tipe String
Untuk mendeklarasikan tipe string dapat dilakukan dengan cara menuliskan string
diantara tanda petik tunggal (’) atau tanda petik ganda (”) Contoh :
3. Tipe Boolean
Tipe boolean hanya mempunyai nilai True atau False. Tipe ini biasanya
digunakan untuk mengecek suatu kondisi atau keadaan
4. Tipe Null
Tipe Null digunakan untuk merepresentasikan variabel yang tidak diberi nilai
awal (inisialisasi).
3
bulat.
4. Operator Pembanding
Digunakan untuk membandingkan dua buah operan. Operan yang dikenal
operator ini dapat bertipe string, numerik, maupun ekspresi lain.
5. Operator Logika
Digunakan untuk mengoperasikan operan yang bertipe boolean.
6. 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.
4
E. Objek Select
Objek Select menyimpan informasi tentang elemen form yang berupa
kotak daftar. Objek select berguna apabila di dalam form terdapat banyak pilihan
yang telah mempunyai nilai tertentu.
1. Percabangan
Untuk membuat suatu halaman yang dinamis dan interaktif, perancang
halaman Web membutuhkan perintah-perintah yang dapat mengatur aliran dari
informasi. Pada dasarnya, JavaScript terdapat dua macam pernyataan
percabangan yaitu if..else dan switch
A. If..Else
Pernyataan ini digunakan untuk menguji sebuah kondisi dan
kemudian mengeksekusi pernyataan tertentu bila kondisi tersebut
terpenuhi, dan mengeksekusi pernyataan lain bila kondisi tersebut tidak
terpenuhi.
B. 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.
2.Perulangan
Untuk mengulang kejadian beberapa kali maka kita membutuhkan proses
perulangan. Pada JavaScript dikenal metode/cara perulangan.
A. Perulangan For
Digunakan untuk mengeksekusi pernyataan-pernyataan beberapa
kali. Perulangan For paling sering dipakai, jika anda sudah tahu akhir
dari perulangan tersebut. Perintah for mengulang suatu loop sampai
kondisi menghasilkan evaluasi true atau loop keluar dengan perintah
break.
5
B.Perulangan Do While
Perulangan Do While merupakan perulangan yang hampir mirip
dengan perulangan while namun perbedaanya, pada perulangan Do
While, maka minimal instruksi dijalankan sekali saja.
BAB II
PEMBAHASAN
2.1 Pengertian
Secara fungsional, JavaScript digunakan untuk menyediakan akses script
pada objek yang dibenamkan ( embedded ). Contoh sederhana dari penggunaan
JavaScript adalah membuka halaman pop up, fungsi validasi pada form sebelum
data dikirimkan ke server, merubah image kursor ketika melewati objek tertentu,
dan lain lain.
Yang harus diperhatikan dalam pengelolaan pemrograman JavaScript,
diantaranya JavaScript adalah “case sensitive”, yang artinya JavaScript
membedakan huruf besar dan huruf kecil. Jika Anda pernah belajar bahasa
pemrograman seperti Turbo C atau C++, maka sama seperti bahasa pemrograman
tersebut, dimana huruf T tidak sama dengan huruf t.
Dalam bahasa pemrograman JavaScript juga, sebagai contoh fungsi perintah
var tidak boleh ditulis Var dan juga tidak boleh ditulis VAR (huruf besar semua),
yang benar adalah var (huruf kecil semua). Perintah lain adalah new Date tidak
boleh ditulis new date (huruf kecil semua), dsb.
JavaScript bekerja pada sisi browser. maksudnya begini : untuk
menampilkan halaman web, user menuliskan alamat web di address bar url.
setelah itu, browser “mengambil” file html ( dengan file jJvaScript yang melekat
padanya jika memang ada ) ke server yang beralamat di URL yang diketikan oleh
user. Selesai file diambil, file ditampilkan pada browser. Nah, setelah file
JavaScript berada pada browser, barulah script JavaScript tersebut bekerja.
6
Efek dari Javascript yang bekerja pada sisi browser ini, Javascript dapat
merespon perintah user dengan cepat, dan membuat halaman web menjadi lebih
responsif. JavaScript melakukan apa yang tidak bisa dilakukan oleh HTML, PHP,
dan CSS : menangani hal – hal yang membutuhkan respons cepat terhadap aksi
dari user.
Implementasi terpopuler saat ini dari pemrograman JavaScript adalah
teknik AJAX. (Asynchronous JavaScript and XMLHTTP ). teknik ini sering
digunakan oleh aplikasi berbasis web seperti Gmail, Google Reader, dan lain lain.
Teknik yang membuat pertukaran data antara server dan browser terjadi di
belakang layar sehingga interaksi antara user dan aplikasi web semakin responsif.
Post tersendiri untuk membahas hal ini akan kita siapkan.
7
document.writeln("</pre>");
//-->
</script></p>
</body>
</html>
2. Kurang
<head>
<title>Operasi Aritmatika</title>
</head>
<body><p><script language="javascript">
<!--
document.writeln("<pre>");
document.writeln("<h1>Operasi Aritmatika</script></h1>");
var A = 100;
var B = 200;
var C = 300;
var D = 400;
var E = a - b;
document.writeln('100 - 200 = ' + E);
E=B-C
document.writeln('200 - 300 = ' + E);
E=C-D
document.writeln('300 - 400 = ' + E);
document.writeln("</pre>");
//-->
</script></p>
</body>
</html>
8
3. Kali
<head>
<title>Operasi Aritmatika</title>
</head>
<body><p><script language="javascript">
<!--
document.writeln("<pre>");
document.writeln("<h1>Operasi Aritmatika</script></h1>");
var A = 100;
var B = 200;
var C = 300;
var D = 400;
var E = a * b;
document.writeln('100 * 200 = ' + E);
E=B*C
document.writeln('200 * 300 = ' + E);
E=C*D
document.writeln('300 * 400 = ' + E);
document.writeln("</pre>");
//-->
</script></p>
</body>
</html>
4. Bagi
<head>
<title>Operasi Aritmatika</title>
</head>
<body><p><script language="javascript">
<!--
document.writeln("<pre>");
9
document.writeln("<h1>Operasi Aritmatika</script></h1>");
var A = 100;
var B = 200;
var C = 300;
var D = 400;
var E = a / b;
document.writeln('100 / 200 = ' + E);
E=B/C
document.writeln('200 / 300 = ' + E);
E=C/D
document.writeln('300 / 400 = ' + E);
document.writeln("</pre>");//-->
</script></p>
</body>
</html>
5. Lingkaran
<html>
<body>
<pre>
<hr align="center" width="400" />
<h1 align="center"> Lingkaran </h1>
<hr align="center" width="400" />
<script language="javascript">
r = prompt("Jari-jari:"," ");
ls = 3.14*(parseInt(r)*parseInt(r));
kl = 2*3.14*(parseFloat(r));
document.write("<font size=2 face=verdana>\t\t\t\t\t\t\t\t\t\t\t\t\t\Jari-jari =" + r +
"Cm" + "<br>");
document.write("\t\t\t\t\t\t\t\t\t\t\t\t\t\Luas = "+ ls + "Cm2" + "<br>");
document.write("\t\t\t\t\t\t\t\t\t\t\t\t\t\Keliling = "+ kl + "Cm2" + "<br>");
10
</script>
</pre>
</body>
<hr align="center" width="400" />
</html>
6. Segitiga
<html>
<body>
<pre>
<hr align="center" width="400" />
<h1 align="center"> Segitiga </h1>
<hr align="center" width="400" />
<script language="javascript">
a = prompt("Alas:"," ");
t = prompt("Tinggi:"," ");
ls = parseInt(a)*parseInt(t)*0.5;
kl = 3*(parseFloat(a));
document.write("<font size=2 face=verdana>\t\t\t\t\t\t\t\t\t\t\t\t\t\Alas =" + a +
"Cm" + "<br>");
document.write("\t\t\t\t\t\t\t\t\t\t\t\t\t\Tinggi ="+ t + "Cm" + "<br>");
document.write("\t\t\t\t\t\t\t\t\t\t\t\t\t\LuasSegitiga ="+ ls + "Cm2" + "<br>");
document.write("\t\t\t\t\t\t\t\t\t\t\t\t\t\KelilingSegitiga = "+ kl + "Cm2" + "<br>");
</script>
</pre>
</body>
<hr align="center" width="400" />
</html>
11
7. Persegi Panjang
<html>
<body>
<pre>
<hr align="center" width="400" />
<h1 align="center"> Persegi Panjang </h1>
<hr align="center" width="400" />
<script language="javascript">
p = prompt("Panjang:"," ");
l = prompt("Lebar:"," ");
ls = parseInt(p)*parseInt(l);
kl = 2*(parseFloat(p)+parseFloat(l));
document.write("<font size=2 face=verdana>\t\t\t\t\t\t\t\t\t\t\t\t\t\Panjang =" + p +
"Cm" + "<br>");
document.write("\t\t\t\t\t\t\t\t\t\t\t\t\t\Lebar ="+ l + "Cm" + "<br>");
document.write("\t\t\t\t\t\t\t\t\t\t\t\t\t\Luas ="+ ls + "Cm2" + "<br>");
document.write("\t\t\t\t\t\t\t\t\t\t\t\t\t\Keliling = "+ kl + "Cm2" + "<br>");
</script>
</pre>
</body>
<hr align="center" width="400" />
</html>
8. Kubus
<html>
<head>
<title>Menghitung Volume Kubus</title>
</head>
<body><p><script language="javascript">
<!--
12
function jumlah()
{
var s = parseFloat(document.fform.sisi.value) ;
if (isNaN (s))
s=0.0;
var volume = s * s * s;
alert ("Volume Kubus = " + volume);
}
//-->
</script></p>
<form name="fform"><h3>Volume Kubus</h3>
<pre>
Sisi : <input type="text" size="11" name="sisi" />
</pre>
<p><input type="button" value="Hitung" onclick="jumlah()" />
<input type="reset" value="Ulang" />
</form></p>
</body>
</html>
9. Balok
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Menghitung Volume Balok</title>
</head>
<body><p><script language="javascript">
13
<!--
function jumlah()
{
var t = parseFloat(document.fform.tinggi.value) ;
var p = parseFloat(document.fform.panjang.value) ;
var l = parseFloat(document.fform.lebar.value) ;
var volume = t * p * l;
alert ("Volume Balok = " + volume);
}
//-->
</script></p>
<form name="fform"><h3>Volume Balok</h3>
<pre>
Lebar : <input type="text" size="11" name="lebar" />
Panjang : <input type="text" size="11" name="panjang" />
Tinggi : <input type="text" size="11" name="tinggi" />
</pre>
<p><input type="button" value="Hitung" onclick="jumlah()" />
<input type="reset" value="Ulang" />
</form></p>
</body>
</html>
10. Continue
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
14
<title>Continue</title>
</head>
<body><script language="javascript">
<!--
var i = 1;
for(i = 1; i <= 100; i++) {
if(i % 2 == 0){
continue;
}
document.writeln(i) ;
}
//-->
</script>
</body>
</html>
15
2. Kurang
3. Perkalian.
4. Pembagian.
16
5. Lingkaran.
6. Segitiga.
7. Persegi Panjang.
17
8. Kubus.
9. Balok
10. Continue.
18
BAB III
PENUTUP
3.1 Kesimpulan
Dari Makalah diatas dapat disimpulkan bahwa Script-script di dalam
JAVASCRIPT adalah bahasa pemrograman yang khusus untuk halaman web agar
halaman web menjadi lebih hidup. Kalau dilihat dari suku katanya terdiri dari dua
suku kata, yaitu Java dan Script. Java adalah Bahasa pemrograman berorientasi
objek, sedangkan Script adalah serangkaian instruksi program.
19
DAFTAR PUSTAKA
o https://www.academia.edu/9782800/Makalah_Java_Script.
o https://developer.mozilla.org/id/docs/Learn/Getting_started_with_the_web/JavaScript
_basics.
20