Materi Dasar Java Script - Repository UNIKOM
Peengantar Java Script
Komputer IT-2
Target Pencapa
aian
Semua siswa dap
apat memahami bagaimana membuat aplikasi
dengan menggun
unakan Java Script
1.1. Java Script
Java Script adalah bahasaa script yang berdasar pada objek yang memperbolehkan
pemakai untuk mengendalik
alikan banyak aspek interaksi pemakai pada suat
atu dokumen
HTML. Dimana objek terseb
ebut dapat berupa suatu window, frame, URL
RL, dokumen,
form, button atau item yan
ang lain. Yang semuanya itu mempunyai propert
rti yang saling
berhubungan dengannya dan
an masing-masing memiliki nama, lokasi, war
arna nilai dan
atribut lain.
1.2. Menjalankan Java Scriptt
Untuk dapat mempelajari pem
emrograman Java Script, ada dua piranti yangg diperlukan
yaitu browser dan teks ed
editor. Teks editor adalah sebuah pengolah
ah kata (word
processor) yang menghasilk
ilkan file dalam format ASCII murni. Bila Anda
A
adalah
pengguna Windows, Anda bisa menggunakan Notepad,Wordpad atau menggunakan
m
Ultraedit Text Editor. Selain it
itu browser web yang akan anda gunakan haruss mendukung
Java Script, Anda dapat mengggunakan Internet Explorer, Opera, FireFox dan .
Kode program JavaScript dapat dituliskan langsung pada file HTTML dengan
menggunakan tag kontainer
er . Dengan kata lain, Anda tidak perlu
lu menuliskan
program JavaScript pada file tterpisah.
Page
1
Ingat bahwa yang dimaksud
d dengan tag kontainer adalah tag yang diaw
awali dengan
dan diakhiri dengan .
http://www.unikomcenter.com
Contoh Script.
1.
2. //program anda masukkan disini
3.
Tag kontainer mem
empunyai dua atribut tetapi yang harus Anda
nda isikan hanya
satu atribut yaitu Languag
age. Isilah atribut language dengan “JavaScrript”. Hal ini
digunakan untuk memberitahu
ahukan pada browser bahwa yang akan Andaa tulis adalah
JavaScript.
1.3. Program Pertama Java SScript
Pada bagian ini, And
nda akan membuat program untuk menamp
pilkan pesan
sederhana kelayar monitor.
G
Gambar 1.1. Menampilkan Teks
Program Pertama
document.writeln("90);
Pada contoh ini menunjukan bahwa jika Y lebih besar dari 90 maka X akan bernilai
b
True.
1.8.4. Tipe Null
Tipe Null digunakan untuk merepresentasikan variabel yang tidak diber
iberi nilai awal
(inisialisasi)
1.9. Operator
Operator pada JavaScript dib
ibagi menjadi enam, yaitu
• Aritmetik
• Pemberian nilai (Assign)
• Pemanipulasian bit (bitwise)
• Pembanding
• Logika
• String
Tungggal/Biner
Biner
er
Biner
er
Keterangan
Penjumlahan
Pengurangan
http://www.unikomcenter.com
Page
Operator
+
-
9
1.9.1. Operator Aritmetik
Operator ini digunakan untuk operan bertipe numerik, Ada dua macam
am operator
aritmetik, yaitu operator nu
umerik tunggal dan operator aritmetik biner
ner. Perbedaan
kedua operator ini terletak p
pada jumlah operan yang harus dioperasikan.
*
/
%
++
--
Biner
er
Biner
er
Biner
er
Tungggal
Tungggal
Tungggal
Perkalian
Pembagian
Modulus
Negasi
Penambahan dengan Satu
Pengurangan dengan Satu
1.9.2. Operator Pemberian N
Nilai
Digunakan untuk memberi nilai ke suatu operan atau mengubaah nilai suatu
u operan.
Operator
Keterangan
Contoh
Exu
uivalen
=
Sama dengan
X=Y
X=X+Y
+=
Ditambah dengan
X+=Y
X=X-Y
X=X
-=
Dikurangi dengan
X-=Y
X=X*Y
X*=Y
*=
Dikalikan dengan
X=X?Y
X=X?
X/=Y
/=
Dibagi dengan
X=X%Y
X=X%
X%=Y
%=
Modulus dengan
X&=Y
X=X&Y
X=X&
&=
Bit AND dengan
X|=Y
X=X|Y
X=X|
|=
Bit OR dengan
Bit
1.9.3. Operasi Pemanipulasii Bi
Operasi ini berhubungan dengan pemanipulasian bit pada operan berttipe bilangan
bulat.
Contoh:
var A = 12; // A = 1100b
var B = 10;
// B = 1010b
var C = A & B
maka akan dihasilkan
an bilangan seperti berikut:
1100b
1010b AND
1000b
http://www.unikomcenter.com
10
Keterangan
Bit AND
Bit OR
Bit XOR
Bit NOT
Geser ke kiri
Geser ke kanan
Geser kekakan dengan diisi nol
Page
Operator
&
|
^
~
>
>>>
var A = 12;
var C = A >1
maka variabel C akan bernilai
ilai 448 (0011 0000b
variabel D akan bernilai 6 (01110b).
1.9.4. Operator Pembanding
nding
Digunakan untuk membandiingkan dua buah operan. Operan yang dikenai
ai operator ini
dapat bertipe string, numerik
ik, maupun ekspresi lain.
Operator
Keterangan
==
Sama dengan
!=
Tidak sama dengan
>
Lebih besar
<
Lebih kecil
>=
Lebih bersar atau sama dengan
function EvenTekan()
{
var jurusanstr = (document.f
t.fform.jurusan.value);
document.fform.jurusanstr.v
r.value=jurusanstr;
}
Penggunaan Select
Pilih Jurusan:
20
Gambar 1.11. Objek Select
Jurusan:
Latihan
Dengan menggunakan Jav
avaScript, buatlah program untum menampilkan proses
perhitungan perkalian, pemb
bagian, pengurangan dan penjumlahan, sepertii berikut:
b
Page
21
Ga
ambar 1.12. Form Input Kalkulator
http://www.unikomcenter.com
Gamba
ar 1.13. Output Jika tombol + ditekan
Page
Gam
ambar 1.14. Membuat Form Lengkap
22
Buatlah Halaman seperti ber
erikut, yang telah mencakup semua materi yang ada
ad di dalam
bab ini:
http://www.unikomcenter.com
Jika Anda Click tombol kirim,.,. M
Maka dihalaman bawah akan ditampilkan data
ta sesuai
s
dengan yang di inputkan dari
ari form sebelah atas
1.11. Percabangan
Seperti dalam bahasa pemrrograman lainnya dalam JavaScript juga ada percabangan.
p
Pada dasarnya dalam JavaSccript terdapat dua macam pernyataan percab
abangan, yaitu
pernyataan if..else dan switcch.
1.11.1. if..else
Pernyataan ini digunakan un
untuk menguji sebuah kondisi dan kemudian mengeksekusi
m
pernyataan tertentu bila kon
ndisi tersebut terpenuhi, dan mengeksekusi pernyataan
per
lain
bila kondisi tersebut tidak ter
erpenuhi.
Contoh:
If..(kondisi)
{
//lakukan pernyataan
n yang ada disini
//jika kondisi terpenuh
uhi
}
else
{
//lakukan pernyataan
n yang ada disini
//jika kondisi tidak dip
dipenuhi
}
http://www.unikomcenter.com
Page
Pada kasus tertentu mungkin
in Anda akan meletakan pernyataan if lain setelah
ah else.
Contoh:
If (x>0)
{
document.writeln(’’ X adalah Bilangan positif’);
}
else if(x)
1.13. Fungsi
Fungsi merupakan bagian p
program yang dapat melakukan tugas tertenttu. Beberapa
fungsi juga ada yang dapat mengembalikan nilai, contohnya adalah funggsi parseFloat
yang sudah digunakan sebelu
elumnya.
1.13.1. Fungsi Buatan
n Sendiri
Page
26
Dalam contoh pembahasan sebelumnya sebenarnya Anda sudah menggun
nakan fungsi.
Untuk mendefinisikan fungsii h
harus diawali dengan kata kunci function.
Sintaknya adalah sebagai ber
erikut:
Function namafungsi(param1
1,param2,…..)
{
//pernyataan
}
http://www.unikomcenter.com
G
Gambar 1.15. Membuat Fungsi.
Program Membuat Fungsi Sendirii
Membuat Fungsi Sendiri
>
function Halo()
{
document.writeln("Halo saya adaalah fungsi buatan");
}
function Tulis(Teks)
{
document.writeln(Teks);
}
function Kali(a,b)
{
return (a*b);
}
document.writeln("");
document.writeln("Membuatt Fungsi Sendiri");
Halo();
Tulis("Ini adalah fungi dengan para
rameter");
var A = Kali(10,5);
Tulis(A);
document.writeln("");
1.13.2. Fungsi Bawaan
http://www.unikomcenter.com
Page
• Fungsi eval
Digunakan untuk mengevaluasi ekspresi atau mengeksekusi pernyataan Jav
avaScript.
Contoh.
eval(str)
fungsi eval digunakan
an sebagai pengevaluasi ekspresi seperti contoh
h berikut:
b
27
Dalam JavaScript telah dised
ediakan beberapa fungsi bawaan yang akan san
angat berguna
sekali bagi Anda, disini yan
ang akan dibahas yaitu mengenai fungsi eval,
al, parseInt,
parseFloat, isNan
var A=eval(“10*2+3”));
memberikan nila 23 kke variabel A
var garis = “document
ent.write(“”);
jika anda tuliskan seperti ini:i:
eval(garis);
maka dijendela browser akan
an ditampilkan garis
• Fungsi parseInt dan parsseFloat
Kedua fungsi ini hampir sama, keduanya meminta sebuah parameter bertip
ipe string dan
mengkonversikannya ke numerik.
Contoh
parseInt(str,[radiks])
parseFloat(str);
contoh penggunaan
var A = parseInt(“173”,8); // 1
123 bilangan basis 8
var B = parseFloat(“3.14”); /// 3.14
var C = parseFloat(0.314E1”);
); ///3.14
Page
28
• Fungsi isNaN
Digunakan untuk menguji ap
apakah suatu variabel adalah bilangan atau bukan, jika
bilangan maka akan mengem
embalikan nilai true, jika bukan maka bernilai fals
alse
Contoh
var X=parseInt(“123”);
if (isNaN(X))
X = -10;
Artinya jika X bukan bilangan
an maka X adalah –10
Berikut adalah contoh sebu
uah halaman yang telah menggunakan fungsii bawaan dan
fungsi buatan.
http://www.unikomcenter.com
Ga
ambar 1.16. Menggunakan Fungsi
Page
29
Program Menggunakan Fungsii Bawaan dan Fungsi Buatan
Memasukan Data
e>
function EvenTekan()
{
var NamaAnda = (document.f
.fForm.Nama.value);
var JamKerja = parseInt (docu
ument.fForm.JamKer.value);
var UpahPerJam = parseInt (document.fForm.Upah.value);
var Total = JamKerja * UpahPer
erJam;
document.fForm.NamaAnda.v
.value=NamaAnda;
document.fForm.Total.value=T
e=Total;
alert("Total " + Total);
}
Menggunakan Fungsi Bawaaan dan Fungsi Buatan
Masukan:
Nama :
Jam Kerja :
Nama
:
http://www.unikomcenter.com
Latihan
Dengan menggunakan fungsi
si b
bawaan buatlah sebuah halaman untuk mencar
ari akar
persamaan kuadrat
Page
30
Gambar 1.1
11. Membuat Program Persamaan Kuadrat
http://www.unikomcenter.com
1.14. Kejadian
Even adalah sesuatu yang ter
erjadi pada halaman HTML. Berikut ini ada beber
erapa bentuk
contoh kejadian yaitu jika p
pengguna memuat dokumen, pengguna memasukan data
pada kotak teks, pengguna mengklik tombol, dsb.
Semua kejadian pada JavaSccript dapat Anda tangani dengan menentukan kejadiannya.
Biasanya penanganan kejadian
ian adalah sebuah fungsi, tetapi pada beberapaa kasus, Anda
bisa menuliskan pernyataan--pernyataan secara langsung.
http://www.unikomcenter.com
Page
Untuk menangani suatu kejad
ejadian, tambahkan atribut onKejadian pada tag
ag yang sesuai.
Kemudian isilah atribut in
ini dengan pernyataan-pernyataan JavaScrip
ipt. Biasanya
pernyataan yang diisikan ber
erupa pemanggilan ke suatu fungsi.
31
Berikut ini adalah daftar kejad
ejadian pada JavaScript
Kejadian
Keter
erangan
Abort
Diban
ngkitkan bila pengguna menghentikan pemuat
atan citra
(tag
function Mahasiswa(Nama,Alamat,Jurusan)
{
this.Nama=Nama;
this.Alamat=Alamat;
this.Jurusan=Jurusan;
}
function Tulis(objek)
{
for (var x in objek)
document.writeln(objek[x])
x]);
document.writeln(" ");
}
Page
//menciptakan instan objek mahassiswa
var Sintia = new Mahasiswa ("Sintiia Ratna Dewi","Jl.Panorama III No. 80","Sekretaris");
var Sisca = new Mahasiswa ("Siscaa Nawangwulan","Jl.Ciwaruga No. 72","Akuntansi");
var Sarah = new Mahasiswa ("Sara
rah Galabagan","Jl.Bagdad No. 76","Informatika");
36
>document.writeln("Membuat Objek ");
document.writeln("");
Tulis(Sintia);
http://www.unikomcenter.com
Tulis(Sisca);
Tulis(Sarah);
document.writeln("");
1.15.2. Mendefinisikan Metode
Objek merupkan pengkapsulan properti/variabel bersama-sama dengan metode /fungsi. Untuk
mendefinisikan metode, pertama-ttama Anda harus mendefinisikan fungsi biasa.
Contoh:
function Anu()
{
}
Kemudian pada definisi objek, tambahkan sebuah metode yang menunjuk fungsi Anu.
Contoh
this.metode=Anu;
Sekarang anda sudah memiliki sebuah metode yang bernama metode.
Berikut ini adalah sebuah halaman
n yang telah menggunakan Metode untuk menuliskan objjek.
Gambar 1.23. Pemakaian Metode
http://www.unikomcenter.com
Page
function TulisObjek()
{
document.writeln("Namaa : " + this.Nama);
37
Pemakaian Metode dalam Java Scri
ript
>
function Mahasiswa(Nama,Alamat,Jurusan)
{
this.Nama=Nama;
this.Alamat=Alamat;
this.Jurusan=Jurusan;
//deklarasi metode
this.Tulis=TulisObjek;
this.Ubah=UbahObjek;
}
document.writeln("Alamaat : " + this.Alamat);
document.writeln("Jurusaan : " + this.Jurusan);
document.writeln(" ");
}
function UbahObjek(Nama,Alamatt,Jurusan)
{
this.Nama
= Nama;
this.Alamat
= Alamaat;
this.Jurusan
= Jurusaan;
}
document.writeln("Membuatt Objek ");
document.writeln("");
//menciptakan instan objek mahassiswa
Mhs = new Mahasiswa ("Sintia Rattna Dewi","Jl.Panorama III No. 80","Sekretaris");
Mhs.Tulis();
//mengubah properti objek
Mhs.Ubah("Sisca Si Jenat","Jl.Ciwaaruga 74","Perbankan");
Mhs.Tulis();
document.writeln("");
1.16. Array
Array pada JavaScript merupakan sekumpulan elemen, dimana masing-masing elemen dap
apat bertipe apa
saja. Jadi konsep array dapat dikattakan sebagai penggabungan beberapa variabel menjadi satu
s
kesatuan.
Contoh JavaScript untuk array:
http://www.unikomcenter.com
Page
Program Menampilkan Array
>
function RataRata()
{
38
Gambar 1.24. Menampilkan Array
var Jumlah=0.0;
var Total = RataRata.argum
ments.length;
for (var i=0;i
function Tulis(A,str)
{
document.writeln(str)
for (var i=0;i
>
document.write("");
var MahasiswaBaru = ["Kemala","
,"Adinda"];
Tulis(MahasiswaBaru,"Objek Mahaasiswa Baru: ");
var MahasiswaGabungan = Mahassiswa.concat(MahasiswaBaru);
Tulis(MahasiswaGabungan,"Objek setelah digabung");
MahasiswaGabungan = MahasiswaaGabungan.slice(1,3);
Tulis(MahasiswaGabungan,"Setelaah objeck di slice (1,3): ");
document.write("");
>
1.17. Frame dalam Java Script
Untuk membuat menu dengan m
menggunakan frame dapat dilakukan dengan menggunak
akan kombinasi
perintah html dan java script, diimana framenya di buat di html sedangkan actionnya dibuat dengan
menggunakan java script.
Contoh, misalnya Anda akan memb
buat sebuah halaman seperti berikut:
Gambar 1.26. Halaman Utama Frame
Jika Anda Click pilihan Google, m
maka akan ditampilkan halaman seperti berikut pada jendela
j
sebelah
kanan:
http://www.unikomcenter.com
Page
Gamb
bar 1.21. Menampilkan website yahoo.com
40
Jika Anda Click tombol Yahoo, kemudian Anda tekan tombol Tampilkan, maka pada jendela
j
sebelah
kanan akan ditampilkan halaman sseperti berikut:
Gamb
bar 1.21. Menampilkan Website google.com
Jika Anda Click pilihan Detik, makka akan ditampilkan halaman detik.com, seperti beriku
ut pada jendela
sebelah kanan:
Gamb
bar 1.28. Menmapilkan Website Detik.com
Program utama.html
Detik
Halaman ini diibuat dengan menggunakan
">Frame
Design By Fahra Ragita
Daftar Pustaka:
JavaScript, Antony Pranata
Java Script Tutorial, w3c
Dan dari semua yang tidak dapat d
disebutkan satu persatu
Sekian. Selamat Mencoba, sam
ampai jumpa lagi pada materi dan latihan lainnyya.
Nb.nanti diteruskan lagi yah…
…..
Taryana Suryana. M.Kom
Teknik Informatika
Universitas Komputer Indones
esia
taryanarx@yahoo.com
Page
42
Materi ini dapat di download
ad di http://nilaionline.unikom.ac.id
http://www.unikomcenter.com
Komputer IT-2
Target Pencapa
aian
Semua siswa dap
apat memahami bagaimana membuat aplikasi
dengan menggun
unakan Java Script
1.1. Java Script
Java Script adalah bahasaa script yang berdasar pada objek yang memperbolehkan
pemakai untuk mengendalik
alikan banyak aspek interaksi pemakai pada suat
atu dokumen
HTML. Dimana objek terseb
ebut dapat berupa suatu window, frame, URL
RL, dokumen,
form, button atau item yan
ang lain. Yang semuanya itu mempunyai propert
rti yang saling
berhubungan dengannya dan
an masing-masing memiliki nama, lokasi, war
arna nilai dan
atribut lain.
1.2. Menjalankan Java Scriptt
Untuk dapat mempelajari pem
emrograman Java Script, ada dua piranti yangg diperlukan
yaitu browser dan teks ed
editor. Teks editor adalah sebuah pengolah
ah kata (word
processor) yang menghasilk
ilkan file dalam format ASCII murni. Bila Anda
A
adalah
pengguna Windows, Anda bisa menggunakan Notepad,Wordpad atau menggunakan
m
Ultraedit Text Editor. Selain it
itu browser web yang akan anda gunakan haruss mendukung
Java Script, Anda dapat mengggunakan Internet Explorer, Opera, FireFox dan .
Kode program JavaScript dapat dituliskan langsung pada file HTTML dengan
menggunakan tag kontainer
er . Dengan kata lain, Anda tidak perlu
lu menuliskan
program JavaScript pada file tterpisah.
Page
1
Ingat bahwa yang dimaksud
d dengan tag kontainer adalah tag yang diaw
awali dengan
dan diakhiri dengan .
http://www.unikomcenter.com
Contoh Script.
1.
2. //program anda masukkan disini
3.
Tag kontainer mem
empunyai dua atribut tetapi yang harus Anda
nda isikan hanya
satu atribut yaitu Languag
age. Isilah atribut language dengan “JavaScrript”. Hal ini
digunakan untuk memberitahu
ahukan pada browser bahwa yang akan Andaa tulis adalah
JavaScript.
1.3. Program Pertama Java SScript
Pada bagian ini, And
nda akan membuat program untuk menamp
pilkan pesan
sederhana kelayar monitor.
G
Gambar 1.1. Menampilkan Teks
Program Pertama
document.writeln("90);
Pada contoh ini menunjukan bahwa jika Y lebih besar dari 90 maka X akan bernilai
b
True.
1.8.4. Tipe Null
Tipe Null digunakan untuk merepresentasikan variabel yang tidak diber
iberi nilai awal
(inisialisasi)
1.9. Operator
Operator pada JavaScript dib
ibagi menjadi enam, yaitu
• Aritmetik
• Pemberian nilai (Assign)
• Pemanipulasian bit (bitwise)
• Pembanding
• Logika
• String
Tungggal/Biner
Biner
er
Biner
er
Keterangan
Penjumlahan
Pengurangan
http://www.unikomcenter.com
Page
Operator
+
-
9
1.9.1. Operator Aritmetik
Operator ini digunakan untuk operan bertipe numerik, Ada dua macam
am operator
aritmetik, yaitu operator nu
umerik tunggal dan operator aritmetik biner
ner. Perbedaan
kedua operator ini terletak p
pada jumlah operan yang harus dioperasikan.
*
/
%
++
--
Biner
er
Biner
er
Biner
er
Tungggal
Tungggal
Tungggal
Perkalian
Pembagian
Modulus
Negasi
Penambahan dengan Satu
Pengurangan dengan Satu
1.9.2. Operator Pemberian N
Nilai
Digunakan untuk memberi nilai ke suatu operan atau mengubaah nilai suatu
u operan.
Operator
Keterangan
Contoh
Exu
uivalen
=
Sama dengan
X=Y
X=X+Y
+=
Ditambah dengan
X+=Y
X=X-Y
X=X
-=
Dikurangi dengan
X-=Y
X=X*Y
X*=Y
*=
Dikalikan dengan
X=X?Y
X=X?
X/=Y
/=
Dibagi dengan
X=X%Y
X=X%
X%=Y
%=
Modulus dengan
X&=Y
X=X&Y
X=X&
&=
Bit AND dengan
X|=Y
X=X|Y
X=X|
|=
Bit OR dengan
Bit
1.9.3. Operasi Pemanipulasii Bi
Operasi ini berhubungan dengan pemanipulasian bit pada operan berttipe bilangan
bulat.
Contoh:
var A = 12; // A = 1100b
var B = 10;
// B = 1010b
var C = A & B
maka akan dihasilkan
an bilangan seperti berikut:
1100b
1010b AND
1000b
http://www.unikomcenter.com
10
Keterangan
Bit AND
Bit OR
Bit XOR
Bit NOT
Geser ke kiri
Geser ke kanan
Geser kekakan dengan diisi nol
Page
Operator
&
|
^
~
>
>>>
var A = 12;
var C = A >1
maka variabel C akan bernilai
ilai 448 (0011 0000b
variabel D akan bernilai 6 (01110b).
1.9.4. Operator Pembanding
nding
Digunakan untuk membandiingkan dua buah operan. Operan yang dikenai
ai operator ini
dapat bertipe string, numerik
ik, maupun ekspresi lain.
Operator
Keterangan
==
Sama dengan
!=
Tidak sama dengan
>
Lebih besar
<
Lebih kecil
>=
Lebih bersar atau sama dengan
function EvenTekan()
{
var jurusanstr = (document.f
t.fform.jurusan.value);
document.fform.jurusanstr.v
r.value=jurusanstr;
}
Penggunaan Select
Pilih Jurusan:
20
Gambar 1.11. Objek Select
Jurusan:
Latihan
Dengan menggunakan Jav
avaScript, buatlah program untum menampilkan proses
perhitungan perkalian, pemb
bagian, pengurangan dan penjumlahan, sepertii berikut:
b
Page
21
Ga
ambar 1.12. Form Input Kalkulator
http://www.unikomcenter.com
Gamba
ar 1.13. Output Jika tombol + ditekan
Page
Gam
ambar 1.14. Membuat Form Lengkap
22
Buatlah Halaman seperti ber
erikut, yang telah mencakup semua materi yang ada
ad di dalam
bab ini:
http://www.unikomcenter.com
Jika Anda Click tombol kirim,.,. M
Maka dihalaman bawah akan ditampilkan data
ta sesuai
s
dengan yang di inputkan dari
ari form sebelah atas
1.11. Percabangan
Seperti dalam bahasa pemrrograman lainnya dalam JavaScript juga ada percabangan.
p
Pada dasarnya dalam JavaSccript terdapat dua macam pernyataan percab
abangan, yaitu
pernyataan if..else dan switcch.
1.11.1. if..else
Pernyataan ini digunakan un
untuk menguji sebuah kondisi dan kemudian mengeksekusi
m
pernyataan tertentu bila kon
ndisi tersebut terpenuhi, dan mengeksekusi pernyataan
per
lain
bila kondisi tersebut tidak ter
erpenuhi.
Contoh:
If..(kondisi)
{
//lakukan pernyataan
n yang ada disini
//jika kondisi terpenuh
uhi
}
else
{
//lakukan pernyataan
n yang ada disini
//jika kondisi tidak dip
dipenuhi
}
http://www.unikomcenter.com
Page
Pada kasus tertentu mungkin
in Anda akan meletakan pernyataan if lain setelah
ah else.
Contoh:
If (x>0)
{
document.writeln(’’ X adalah Bilangan positif’);
}
else if(x)
1.13. Fungsi
Fungsi merupakan bagian p
program yang dapat melakukan tugas tertenttu. Beberapa
fungsi juga ada yang dapat mengembalikan nilai, contohnya adalah funggsi parseFloat
yang sudah digunakan sebelu
elumnya.
1.13.1. Fungsi Buatan
n Sendiri
Page
26
Dalam contoh pembahasan sebelumnya sebenarnya Anda sudah menggun
nakan fungsi.
Untuk mendefinisikan fungsii h
harus diawali dengan kata kunci function.
Sintaknya adalah sebagai ber
erikut:
Function namafungsi(param1
1,param2,…..)
{
//pernyataan
}
http://www.unikomcenter.com
G
Gambar 1.15. Membuat Fungsi.
Program Membuat Fungsi Sendirii
Membuat Fungsi Sendiri
>
function Halo()
{
document.writeln("Halo saya adaalah fungsi buatan");
}
function Tulis(Teks)
{
document.writeln(Teks);
}
function Kali(a,b)
{
return (a*b);
}
document.writeln("");
document.writeln("Membuatt Fungsi Sendiri");
Halo();
Tulis("Ini adalah fungi dengan para
rameter");
var A = Kali(10,5);
Tulis(A);
document.writeln("");
1.13.2. Fungsi Bawaan
http://www.unikomcenter.com
Page
• Fungsi eval
Digunakan untuk mengevaluasi ekspresi atau mengeksekusi pernyataan Jav
avaScript.
Contoh.
eval(str)
fungsi eval digunakan
an sebagai pengevaluasi ekspresi seperti contoh
h berikut:
b
27
Dalam JavaScript telah dised
ediakan beberapa fungsi bawaan yang akan san
angat berguna
sekali bagi Anda, disini yan
ang akan dibahas yaitu mengenai fungsi eval,
al, parseInt,
parseFloat, isNan
var A=eval(“10*2+3”));
memberikan nila 23 kke variabel A
var garis = “document
ent.write(“”);
jika anda tuliskan seperti ini:i:
eval(garis);
maka dijendela browser akan
an ditampilkan garis
• Fungsi parseInt dan parsseFloat
Kedua fungsi ini hampir sama, keduanya meminta sebuah parameter bertip
ipe string dan
mengkonversikannya ke numerik.
Contoh
parseInt(str,[radiks])
parseFloat(str);
contoh penggunaan
var A = parseInt(“173”,8); // 1
123 bilangan basis 8
var B = parseFloat(“3.14”); /// 3.14
var C = parseFloat(0.314E1”);
); ///3.14
Page
28
• Fungsi isNaN
Digunakan untuk menguji ap
apakah suatu variabel adalah bilangan atau bukan, jika
bilangan maka akan mengem
embalikan nilai true, jika bukan maka bernilai fals
alse
Contoh
var X=parseInt(“123”);
if (isNaN(X))
X = -10;
Artinya jika X bukan bilangan
an maka X adalah –10
Berikut adalah contoh sebu
uah halaman yang telah menggunakan fungsii bawaan dan
fungsi buatan.
http://www.unikomcenter.com
Ga
ambar 1.16. Menggunakan Fungsi
Page
29
Program Menggunakan Fungsii Bawaan dan Fungsi Buatan
Memasukan Data
e>
function EvenTekan()
{
var NamaAnda = (document.f
.fForm.Nama.value);
var JamKerja = parseInt (docu
ument.fForm.JamKer.value);
var UpahPerJam = parseInt (document.fForm.Upah.value);
var Total = JamKerja * UpahPer
erJam;
document.fForm.NamaAnda.v
.value=NamaAnda;
document.fForm.Total.value=T
e=Total;
alert("Total " + Total);
}
Menggunakan Fungsi Bawaaan dan Fungsi Buatan
Masukan:
Nama :
Jam Kerja :
Nama
:
http://www.unikomcenter.com
Latihan
Dengan menggunakan fungsi
si b
bawaan buatlah sebuah halaman untuk mencar
ari akar
persamaan kuadrat
Page
30
Gambar 1.1
11. Membuat Program Persamaan Kuadrat
http://www.unikomcenter.com
1.14. Kejadian
Even adalah sesuatu yang ter
erjadi pada halaman HTML. Berikut ini ada beber
erapa bentuk
contoh kejadian yaitu jika p
pengguna memuat dokumen, pengguna memasukan data
pada kotak teks, pengguna mengklik tombol, dsb.
Semua kejadian pada JavaSccript dapat Anda tangani dengan menentukan kejadiannya.
Biasanya penanganan kejadian
ian adalah sebuah fungsi, tetapi pada beberapaa kasus, Anda
bisa menuliskan pernyataan--pernyataan secara langsung.
http://www.unikomcenter.com
Page
Untuk menangani suatu kejad
ejadian, tambahkan atribut onKejadian pada tag
ag yang sesuai.
Kemudian isilah atribut in
ini dengan pernyataan-pernyataan JavaScrip
ipt. Biasanya
pernyataan yang diisikan ber
erupa pemanggilan ke suatu fungsi.
31
Berikut ini adalah daftar kejad
ejadian pada JavaScript
Kejadian
Keter
erangan
Abort
Diban
ngkitkan bila pengguna menghentikan pemuat
atan citra
(tag
function Mahasiswa(Nama,Alamat,Jurusan)
{
this.Nama=Nama;
this.Alamat=Alamat;
this.Jurusan=Jurusan;
}
function Tulis(objek)
{
for (var x in objek)
document.writeln(objek[x])
x]);
document.writeln(" ");
}
Page
//menciptakan instan objek mahassiswa
var Sintia = new Mahasiswa ("Sintiia Ratna Dewi","Jl.Panorama III No. 80","Sekretaris");
var Sisca = new Mahasiswa ("Siscaa Nawangwulan","Jl.Ciwaruga No. 72","Akuntansi");
var Sarah = new Mahasiswa ("Sara
rah Galabagan","Jl.Bagdad No. 76","Informatika");
36
>document.writeln("Membuat Objek ");
document.writeln("");
Tulis(Sintia);
http://www.unikomcenter.com
Tulis(Sisca);
Tulis(Sarah);
document.writeln("");
1.15.2. Mendefinisikan Metode
Objek merupkan pengkapsulan properti/variabel bersama-sama dengan metode /fungsi. Untuk
mendefinisikan metode, pertama-ttama Anda harus mendefinisikan fungsi biasa.
Contoh:
function Anu()
{
}
Kemudian pada definisi objek, tambahkan sebuah metode yang menunjuk fungsi Anu.
Contoh
this.metode=Anu;
Sekarang anda sudah memiliki sebuah metode yang bernama metode.
Berikut ini adalah sebuah halaman
n yang telah menggunakan Metode untuk menuliskan objjek.
Gambar 1.23. Pemakaian Metode
http://www.unikomcenter.com
Page
function TulisObjek()
{
document.writeln("Namaa : " + this.Nama);
37
Pemakaian Metode dalam Java Scri
ript
>
function Mahasiswa(Nama,Alamat,Jurusan)
{
this.Nama=Nama;
this.Alamat=Alamat;
this.Jurusan=Jurusan;
//deklarasi metode
this.Tulis=TulisObjek;
this.Ubah=UbahObjek;
}
document.writeln("Alamaat : " + this.Alamat);
document.writeln("Jurusaan : " + this.Jurusan);
document.writeln(" ");
}
function UbahObjek(Nama,Alamatt,Jurusan)
{
this.Nama
= Nama;
this.Alamat
= Alamaat;
this.Jurusan
= Jurusaan;
}
document.writeln("Membuatt Objek ");
document.writeln("");
//menciptakan instan objek mahassiswa
Mhs = new Mahasiswa ("Sintia Rattna Dewi","Jl.Panorama III No. 80","Sekretaris");
Mhs.Tulis();
//mengubah properti objek
Mhs.Ubah("Sisca Si Jenat","Jl.Ciwaaruga 74","Perbankan");
Mhs.Tulis();
document.writeln("");
1.16. Array
Array pada JavaScript merupakan sekumpulan elemen, dimana masing-masing elemen dap
apat bertipe apa
saja. Jadi konsep array dapat dikattakan sebagai penggabungan beberapa variabel menjadi satu
s
kesatuan.
Contoh JavaScript untuk array:
http://www.unikomcenter.com
Page
Program Menampilkan Array
>
function RataRata()
{
38
Gambar 1.24. Menampilkan Array
var Jumlah=0.0;
var Total = RataRata.argum
ments.length;
for (var i=0;i
function Tulis(A,str)
{
document.writeln(str)
for (var i=0;i
>
document.write("");
var MahasiswaBaru = ["Kemala","
,"Adinda"];
Tulis(MahasiswaBaru,"Objek Mahaasiswa Baru: ");
var MahasiswaGabungan = Mahassiswa.concat(MahasiswaBaru);
Tulis(MahasiswaGabungan,"Objek setelah digabung");
MahasiswaGabungan = MahasiswaaGabungan.slice(1,3);
Tulis(MahasiswaGabungan,"Setelaah objeck di slice (1,3): ");
document.write("");
>
1.17. Frame dalam Java Script
Untuk membuat menu dengan m
menggunakan frame dapat dilakukan dengan menggunak
akan kombinasi
perintah html dan java script, diimana framenya di buat di html sedangkan actionnya dibuat dengan
menggunakan java script.
Contoh, misalnya Anda akan memb
buat sebuah halaman seperti berikut:
Gambar 1.26. Halaman Utama Frame
Jika Anda Click pilihan Google, m
maka akan ditampilkan halaman seperti berikut pada jendela
j
sebelah
kanan:
http://www.unikomcenter.com
Page
Gamb
bar 1.21. Menampilkan website yahoo.com
40
Jika Anda Click tombol Yahoo, kemudian Anda tekan tombol Tampilkan, maka pada jendela
j
sebelah
kanan akan ditampilkan halaman sseperti berikut:
Gamb
bar 1.21. Menampilkan Website google.com
Jika Anda Click pilihan Detik, makka akan ditampilkan halaman detik.com, seperti beriku
ut pada jendela
sebelah kanan:
Gamb
bar 1.28. Menmapilkan Website Detik.com
Program utama.html
Detik
Halaman ini diibuat dengan menggunakan
">Frame
Design By Fahra Ragita
Daftar Pustaka:
JavaScript, Antony Pranata
Java Script Tutorial, w3c
Dan dari semua yang tidak dapat d
disebutkan satu persatu
Sekian. Selamat Mencoba, sam
ampai jumpa lagi pada materi dan latihan lainnyya.
Nb.nanti diteruskan lagi yah…
…..
Taryana Suryana. M.Kom
Teknik Informatika
Universitas Komputer Indones
esia
taryanarx@yahoo.com
Page
42
Materi ini dapat di download
ad di http://nilaionline.unikom.ac.id
http://www.unikomcenter.com