MODUL JAVA
SCRIPT 1
FARADILA AGUSTIN (2225200014)
PENDIDIKAN MATEMATIKA
- U N I V E R S I TA S S U LTA N
AGEN G T I RTAYA SA
MODUL JAVA SCRIPT 1
APA ITU JAVA SCRIPT ? YUK KITA
MENGENAL BERSAMA TENTANG
JAVA SCRIPT…
MODUL JAVA SCRIPT 1
MENGENAL JAVA SCRIPT
Apa pemikiran awal kalian saat mendengar kata java script? Bahasa pemograman?.
Javascript merupakan salah satu bahasa pemrograman website yang dapat membuat halaman
web kalian lebih menarik dan lebih hidup. Bahasa pemrograman javascript itu dijalankan di
fitur pengunjung web atau blog, bukan di server jadi berbeda dengan PHP.
Javascript juga dikatakan berbeda dari HTML dan CSS. HTML itu fungsinya untuk
mengendalikan tampilan konten serta CSS mengelola layoutnya jadi ketiganya sangatlah
berbeda. Banyak yang mengibaratkan perbandingan HTML, CSS, serta javascript semacam
bangunan rumah, perabotan di dalamnya, dan lampu serta pintu- pintu.
Jadi, HTML itu diibaratkan sebagai bangunan rumah yang digunakan untuk pondasi seluruh
hal semacam tempat berdirinya tembok, pintu, atap, serta lain sebagainya. Sebaliknya CSS itu
merupakan perabotan hiasan yang sanggup memperindah rumah sepeti hiasan rumah,
wallpaper, karpet, serta lain sebagainya. Javascript berfungsi bagaikan perihal yang
menghidupkan serta responsif semacam bisa untuk menyalakan lampu ataupun membukakan
pintu.
Javascript merupakan salah satu bahasa pemrograman yang sangat banyak digunakan.
Terlebih lagi javascript pula diketahui bagaikan salah satu dari 3 bahasa pemrograman utama
untuk website pengembang:
HTML: Membolehkan Kamu untuk meningkatkan konten ke halaman website.
CSS: Memastikan layout, gaya, dan keselarasan halaman web.
Javascript: Menyempurnakan tampilan serta sistem halaman website.
Awalnya bahasa pemrograman Javascript yang dibuat bulan September 1995 ini hanya
dipakai oleh kalangan Netscape, fungsinya pun terbatas tidak seperti saat ini. Namun seiring
berjalannya waktu, javascript terus dikembangkan hingga bisa seperti sekarang ini.
Mulanya di tahun 1996 javascript disebut sebagai ecmascript. Hal tersebut berlanjut hingga
tahun 1998. Di tahun 1998 dimunculkan ecmascript 2 dan tahun 1999 muncul ecmascript 3.
Ecmascript terus dikembangkan hingga akhirnya menjadi javascript yang ada saat ini.
Javascript hampir digunakan oleh 92 persen website yang ada pada tahun 2016. Untuk saat
ini, mungkin jumlahnya lebih dari itu. Keren kan?
MODUL JAVA SCRIPT 1
Jika diperhitungkan, dalam waktu dua puluh tahunan javascript merupakan salah satu bahasa
pemrograman yang populer dan sangat penting keberadaannya. Apabila anda sering
berselancar di internet, anda pasti tahu apa itu javascript atau familiar dengan namanya atau
atau paling tidak anda pernah mendengar istilah javascript.
A. KELEBIHAN JAVA SCRIPT
Berikut ini adalah beberapa kelebihan dan juga keunggulan dari bahasa pemrograman
javascript, yaitu :
1) Tidak membutuhkan resource memory besar (ringan dan kecil)
Kelebihan dan keunggulan pertama dari bahasa pemrograman Javascript adalah dari hal
resource memorynya. Javascript membutuhkan resource memory yang relative kecil dan
ringan. Hal ini tentu saja akan sangat membantu para developer dalam mengembangkan
aplikasi – aplikasi ringan, namun tetap memiliki fitur dan kegunaan yang sangat banyak bagi
user.
2) Mudah untuk dipelajari
Sebuah bahasa pemrograman akan banyak digunakan dan akan banyak dikembangkan
apabila bahasa pemrograman tersebut adalah bahasa pemrograman yang simple dan mudah
untuk dipahami. Nah, bahasa pemrograman Javascript ini adalah salah satu jenis bahasa
pemrograman yang sangat mudah untuk dipelajari.
3) Dinamis
Dinamis adalah keunggulan dan kelebihan berikutnya dari bahasa pemrograman Javascript.
Javascript adalah salah satu bahasa pemrograman yang dinamis diantara banyak bahasa
pemrograman lainnya. Dinamin disini adalah fleksbilitas dari pengembangan aplikasi yang
berbasis Javascript.
4) Multi platform, bisa dijalankan di banyak sistem operasi
Multi platform berarti sebuah aplikasi yang menggunakan bahasa pemrograman Javascript
bisa dibuat dengan basis sistem operasi apapun, termasuk diantaranya dalaah sistem operasi
yang populer digunakan secara umum, seperti sistem operasi Windows, Linux, Android, dan
berbagai macam sistem operasi lainnya.
MODUL JAVA SCRIPT 1
B. KEKURANGAN JAVA SCRIPT
Berikut ini adalah beberapa kekurangan dari bahasa pemrograman Javascript, antara lain :
1) Script yang digunakan pada Javascript tidak terenkripsi
Meskipun Javascript adalah bahasa pemrograman yang simple dan mudah dikembangkan,
namun ternyata hal ini kontras dengan kemampuan enkripsi dari bahasa pemrograman
Javascript. Aplikasi yang dikembangkan dengan menggunakan bahasa pemrograman berbasis
Javascript memiliki enkripsi yang lemah, dan cenderung tidak terenkripsi.
2) Bukan untuk pengembangan aplikasi stand alone
Merupakan kelemahan, yang juga dampak dari tidak terenkripsinya aplikasi berbasi bahasa
pemrograman Javascript. Dengan tingkat keamanan yang sangat rendah, hal ini membuat
bahasa pemrograman Javascript hanya bisa dioptimalkan pada sebuah aplikasi yang
tergantung pada aplikasi lain.
Contohnya adalah aplikasi pada sebuah web browser. Aplikasi javascript ini hanya bisa
dijalankan, ketika user sudah menjalankan aplikasi web browser terlebih dahulu, sehingga hal
ini menyebabkan aplikasi Javascript bukan merupakan aplikasi yang mandiri atau stand
alone.
3) Memiliki keterbatasan objek
Kelemahan berikutnya dari bahasa pemrograman javascript ini adalah terbatasnya objek. Hal
in ijuga dipengaruhi oleh kondisi umum dari bahasa pemrograman Javascript yang sanga
simple dan juga sederhana, sehingga tentu saja hal ini akan sanga mempengaruhi fitur – fitur
yang dimiliki oleh bahasa pemrograman javascipt ini.
MODUL JAVA SCRIPT 1
BAGAIMANA CARA
MENGGUNAKAN JAVA
SCRIPT ???
MODUL JAVA SCRIPT 1
MENDEKLARASIKAN JAVA SCRIPT
1.1CONSOLE.LOG()
Console. Log() ini berfungsi untuk mencetak rangkaian huruf yang diketik
dalam kode kurung.
Untuk contoh kita menyebut karakter bacaan, seperti hello world, sebagai
string. Console.log() wajib memakai ciri kutip tunggal ataupun ganda.
Untuk console.log() setiap pernyataan harus diakhiri dengan titik koma (;) . Dalam
kebanyakan kasus, kode akan berfungsi secara normal bahkan tanpa mengakhiri titik koma,
tetapi praktik/penggunaan yang baik disarankan untuk menyertakannya supaya lebih jelas.
MODUL JAVA SCRIPT 1
Kemudian jika kalian ingin menambahkan komentar maka Anda harus
menambahkan penulisan // di awal baris. Artinya, kode akan diabaikan saat kode
dijalankan. Ini disebut kode memberi komentar . Komentar ini digunakan untuk
meninggalkan catatan dan menjelaskan kode bila perlu.
Contoh :
Script.js
// Cetak "Hello World" ke console
console.log("Hello World");
// Cetak "Ninja Ken" ke console
console.log("Ninja Ken");
// Ubah baris dibawah menjadi komentar
// console.log("Ubah baris ini menjadi komentar");
HASIL
1.2 KALKULASI
MODUL JAVA SCRIPT 1
a. String & Integer
Integer digunakan untuk melakukan kalkulasi seperti penambahan (+) dan pengurangan
(-).
(1)
(2)
Seperti contoh 2 diatas , console.log(5 + 2) akan mencetak hasil penambahan, yaitu 7.
Sedangkan, saat kita meletakkan 5 + 2 dalam tanda kutip, ini akan dicetak sebagai string.
STRING DAN INTEGER ADALAH TIPE DATA YANG BERBEDA
Simbol (+) juga dapat digunakan untuk mengkombinasikan (atau "menggabungkan")
string. Seperti yang di tampilkan di bawah, "Ninja" + " Ken" di cetak sebagai string Ninja
Ken.
MODUL JAVA SCRIPT 1
Contoh :
Script.js
// Cetak hasil 5 tambah 3
console.log(5 + 3);
// Cetak hasil 20 kurang 8
console.log(20 - 8);
// Cetak string "4 + 5"
console.log("4 + 5");
HASIL
b. Perkalian dan Pembagian
Tanda bintang (*) dapat digunakan untuk pengalian dan garis miring kanan (/) dapat
digunakan untuk pembagian.
MODUL JAVA SCRIPT 1
Selanjutnya terdapat simbol persentase (%) untuk mendapatkan modulo (sisa pembagian),
sisa setelah pembagian. Ini berguna karena ada banyak cara untuk menggunakan modulo
dalam pemrograman.
1.3 VARIABEL
Untuk menyatakan variable, tulis let variable Name = nilai.
Simbol (=) dalam pemrograman tidak berarti "sama dengan". Ini berarti menetapkan yang
ada di sisi kanan ke sisi kiri. let adalah deklarasi bahwa "kita akan menentukan sebuah
variable", nama variable ditulis setelah kata kunci ini dan kemudian diberi nilai.
(saat variable name diberi nilai, "John", console.log(name) akan mencetak John)
MODUL JAVA SCRIPT 1
Contoh :
Script.js
// Deklarasikan nama variable dengan nilai string "Ninja Ken"
let name = "Ninja Ken";
// Cetakan nilai nama variable
console.log(name);
Variable berfungsi untuk memudahkan suatu kalimat yang ada tidak sulit untuk diulang
lagi.
MODUL JAVA SCRIPT 1
Cara memperbarui variable yang ada yaitu,
Contoh :
Script.js
let name = "Ninja Ken";
console.log(name);
// Update nilai variable ke "Birdie"
name = "Birdie";
// Cetak nilai dari variable name
console.log(name);
1.4 CONSTANT
konstanta atau ketetetapan adalah nilai tetap, yang berbeda atau berlawanan dengan
variabel yang nilainya bisa berubah – ubah. Ibarat kata seperti Cuaca dan mood adalah
variabel, waktu adalah konstanta. kenapa begitu karena sebuah cuaca tidak mempunyai
ketetapan begitu pula dengan mood yang selalu berubah tidak mempunyai sebuah nilai
ketetapan, sedang waktu mempunyai nilai ketetapan makannya waktu saya ibaratkan
sebuah konstanta.
Begitu pula dengan kecepatan cahaya, PI, dan e, dalam pemrograman konstanta
merupakan sebuah nilai yang tak bisa diubah selama eksekusi program, tidak seperti
sebuah variabel yang nilainya dapat berubah – ubah. Banyak bahasa pemrogramanÂ
MODUL JAVA SCRIPT 1
yang menggunakan sintaksis khusus untuk mendefinisikan sebuah konstanta untuk
membedakannya dari variabel. Dalam pemrograman Javascript mendeklarasikan
konstanta dengan tipe const (menggantikan var) dan nama konstanta huruf besar
(berdasarkan kesepakatan).
Konstanta ditugasi nilai pada saat deklarasi, dan tidak dimungkinkan untuk
memodifikasinya selama program dijalankan.
Contoh :
Script.js
// Deklarasikan constant language
const language = "Prancis";
// Cetak nilai constant language
console.log(language);
// Gunakan constant language untuk mencetak "Saya bisa berbicara bahasa ____"
console.log("Saya bisa berbicara bahasa " + language);
MODUL JAVA SCRIPT 1
1.5 STATEMENT IF
statement if digunakan saat percabangan kondisional, "jika X lakukan Y", akan
diaktifkan. Tulis kondisi tersebut setelah if dan tulis code untuk kapan, kondisi ini akan
valid dalam tanda kurung kurawal { }, seperti :
Contoh :
Script.js
const level = 12;
// Tambahkan pernyataan if dengan kondisi: level > 10
if(level > 10){
console.log("Level Anda lebih tinggi dari 10");
}
MODUL JAVA SCRIPT 1
1.6 BOOLEAN
Boolean adalah kalimat "true" yang di-print di console. Tipe data boolean memiliki dua nilai
yaitu true dan false. Conditional statement dinilai "true" jika kondisi terpenuhi dan "false"
jika sebaliknya.
1.7 PERBANDINGAN
Operator perbandingan yang digunakan dalam pernyataan-pernyataan logis untuk
menentukan kesetaraan atau perbedaan antara variabel atau nilai.
Mengingat bahwa x = 5, tabel di bawah menjelaskan operator perbandingan:
Operator Deskripsi Contoh
== Sama dengan X == 8 adalah salah
x == 5 adalah benar
=== Adalah persis sama dengan === x 5 adalah benar
(nilai dan jenis) x === “5” adalah salah
! = Tidak sama X! = 8 adalah benar
MODUL JAVA SCRIPT 1
> Lebih besar dari X> 8 adalah salah
< Kurang dari X <8 adalah benar
>= Lebih besar dari atau sama X> = 8 adalah salah
dengan
<= Kurang dari atau sama dengan X <= 8 adalah benar
Operator perbandingan dapat digunakan dalam pernyataan bersyarat untuk membandingkan
nilai-nilai dan mengambil tindakan tergantung pada hasil:
If (age<18) document.write(“Too young”);
Anda akan belajar lebih banyak tentang penggunaan pernyataan bersyarat dalam bab
berikutnya dari tutorial ini.
Operator logika digunakan untuk menentukan logika antara variabel atau nilai.
Mengingat bahwa x = 6 dan y = 3, tabel di bawah ini menjelaskan operator logika:
Operator Description Example
&& And (x < 10 && y > 1) is true
|| Or (x==5 || y==5) is false
! Not !(x==y) is true
Contoh :
Script.js
MODUL JAVA SCRIPT 1
const age = 24;
// Output the result of age >= 18
console.log(age >= 18);
// Output the result of age < 18
console.log(age < 18);
// When the value of age is 18 or greater, output "I am 18 or older"
if(age >= 18){
console.log("Saya berusia lebih dari 18 tahun");
}
Contoh 2 :
Script.js
const password = "ninjaken";
MODUL JAVA SCRIPT 1
// When the value of password is "kentheninja", output "Signed in successfully"
if (password === "ninjaken") {
console.log("Berhasil log in");
}
// When the value of password is not "kentheninja", output "Wrong password"
if (password !== "ninjaken") {
console.log("Password salah");
}
1.8 ELSE IF
Berikut ini penulis jelaskan bagaimana cara penggunaan logika IF ELSE pada javascript.
IF digunakan untuk menentukan kondisi pertama, dan akan di eksekusi jika
kondisinya benar.
ELSE IF digunakan untuk menentukan kondisi kedua, apabila setelah pengujian pada
kondisi yang pertama salah, dan akan di eksekusi jika kondisinya benar.
ELSE digunakan apabila semua kondisi sebelumnya salah, maka ELSE adalah
opsional dari kondisi-kondisi lainnya dan akan di eksekusi.
Contoh dibawah ini adalah pseudo-code conditional pada javascript.
MODUL JAVA SCRIPT 1
if(kondisi) {
// statement
}
Yang disebut “kondisi” pada dasarnya adalah operator perbandingan dan atau operator
logika yang digunakan, tentunya sesuai denga kebutuhan masing-masing program.
Sintaks IF ELSE pada JavaScript
Secara real, penulisan IF ELSE pada javascript akan penulis jabarkan di bawah ini.
<html>
<head>
<script type="text/javascript">
var buah = 'apel';
if(buah == 'jeruk') {
console.log('Ini bukan buah apel');
} else if(buah == 'apel') {
console.log('Ini adalah apel');
} else {
console.log('Ini bukan buah');
}
</script>
</head>
</html>
Dari contoh sintaks IF ELSE di atas maka proses yang akan keluar adalah pada kondisi
kedua, dimana variabel buah memiliki nilai apel sehingga sesuai dengan kondisi kedua.
Contoh :
Script.js
MODUL JAVA SCRIPT 1
const age = 17;
// Ketika kondisi tidak terpenuhi, cetak "Saya berusia dibawah 18 tahun"
if (age >= 18) {
console.log("Saya berusia diatas 18 tahun");
} else {
console.log("Saya berusia dibawah 18 tahun");
}
Contoh 2 :
Script.js
const age = 17;
/* Ketika umur diatas 10 tahun tetapi kurang dari 18 tahun, cetak:
"Saya berusia dibawah 18 tahun, namun diatas 9 tahun" */
if (age >= 18) {
console.log("Saya di atas 18 tahun");
}
else {
console.log("saya dibawah 10 tahun");
}
MODUL JAVA SCRIPT 1
1.9 STATEMENT SWITCH
Switch Case digunakan untuk percabangan kode program dimana kondisi yang diperiksa
hanya ada 1 namun memiliki banyak opsi.
switch (kondisi)
{
case hasil_kondisi_1:
// kode program jika kondisi sama dengan hasil_kondisi_1
break;
case hasil_kondisi_2:
// kode program jika kondisi sama dengan hasil_kondisi_2
break;
default:
kode program untuk kondisi lainnya
break;
}
Kondisi untuk inputan struktur SWITCH diatas biasanya merupakan variabel yang akan
diperiksa. Hasil percabangan dari variabel tersebut akan dikelola oleh perintah case.
Opsi default bisa ditambahkan untuk menangani kasus yang tidak ditangani oleh
perintah case atau menjadi kondisi terakhir ketika tidak didefinisikan pada perintah case.
Saya rasa penjelasan diatas sudah cukup mudah untuk dimengerti ya teman – teman, jadi
sekarang kita akan coba menerapkan dengan kasus yang sebenarnya.
MODUL JAVA SCRIPT 1
Pertama, Kaloan coba buka text editor kalian dan kita buat struktur html seperti biasa
dengan kode javascript di dalamnya seperti berikut
<head>
<meta charset="UTF-8">
<title>Switch Case Javascript</title>
</head>
<body>
<script>
var minuman = "Kopi"; //nilai awal
switch(kendaraan){
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>
Berdasarkan kode diatas kita memiliki sebuah variable bernama minuman, dan variable
tersebut dimasukkan kedalam fungsi switch, dan dibawahnya ada beberapa kondisi
menggunakan perintah case.
Jika sudah kalian bisa jalankan pada browser kalian masing – masing.
MODUL JAVA SCRIPT 1
(1) cara menulis statement switch
(2) cara menulis statement switch II
(3) cara menulis statement switch III
Break adalah perintah untuk mengakhiri setiap case di statement switch. Jika tidak ada
break, code dari case berikutnya yang cocok juga akan terpanggil.
MODUL JAVA SCRIPT 1
MODUL JAVA SCRIPT 1
1.10 WHILE STATEMENT
Sebuah statement while di eksekusi pernyataan pernyataannya asalkan memenuhi syarat
kondisinya yang bernilai true/benar. Sebuah statement while terlihat sebagai berikut:
Jika kondisi bernilai false/salah, statement dengan perulangan berhenti di eksekusi dan
kontrol akan melewati statement yang mengikuti perulangan tersebut.
Kondisi terjadi sebelum statement dalam perulangan di eksekusi. Jika kondisi bernilai
true/benar, statement di eksekusi dan kondisi di uji kembali. Jika kondisi
bernilai false/salah, eksekusi akan berhenti dan konrol lewat untuk statement yang
mengikuti while.
Untuk mengeksekusi banyak statement, gunakan blok statement ({ ... }) untuk
mengelompokan banyak statement tersebut.
Cara menerapkan while :
Perhatikan beberapa contoh loop while untuk mem-print angka dari 1 hingga 100.
Pertama, kita akan menulis code yang ingin diulangkan didalam loop while (code
dikotak hijau gambar kiri).
MODUL JAVA SCRIPT 1
Lalu, kita akan menempatkannya didalam { } (tanda kurung kurawal) milik loop
while seperti yang ditunjukkan digambar kanan.
selanjutnya, mari kita tambahkan kondisi untuk menentukan kapan code berhenti
diulang. Disini, jika ingin mengulang konten hingga number kurang dari atau sama
dengan 100, oleh karena itu, kita akan menulis ekspresi kondisional seperti yang
ditunjukkan digambar kiri.
Code didalam {} akan terus diulang selama kondisi yang ditetapkan (number <= 100)
adalah true.
1.11 FOR STATEMENT
Sebuah for loop mengulang hingga kondisi yang ditentukan evaluasinya menjadi salah/false.
for loop pada Javascript serupa dengan for loop pada Java dan C. Sebuah statement
(pernyataan) for terlihat sebagai berikut:
Ketika sebuah for loop dieksekusi, Berikut ini akan terjadi:
Ekspresi yang menginisialisasi yaitu initialExpression, Jika ada, maka akan di
eksekusi. Ekspresi ini biasanya menginisialisasi satu atau lebih penghitung loop,
MODUL JAVA SCRIPT 1
tetapi sintaksnya memperbolehkan ekspresi dengan tingkat kerumitan apapun.
Ekspresi ini juga bisa mendeklarasikan variabel.
Ekpresi condition di evaluasi. JIka value dari kondisi adalah true (benar), maka
statement loop akan dieksekusi. Jika value dari condition false (salah), for loop akan
dihentikan. Jika ekspresi condition dihilangkan sama sekali, kondisinya diasumsikan
benar.
Mengeksekusi Statement . Untuk mengeksekusi berbagai pernyataan, gunakanlah
sebuah blok pernyataan ({ ... }) untuk mengelompokkan pernyataan-pernyataan
tersebut.
Jika ada, ekspresi baru incrementExpression di eksekusi.
Kontrol kembali ke langkah ke-2.
Contoh :
1.12 MENERAPKAN ITERASI
Pada gambar diatas, kita akan tetap mem-print angka dari 1 hingga 100. Namun, bila
angka adalah kelipatan 3, kita akan mem-print "Kelipatan 3".
1.13 ARRAY
Array adalah sebuah variabel yang bisa menyimpan banyak data dalam satu variabel.
MODUL JAVA SCRIPT 1
Array menggunakan indeks untuk memudahkan akses terhadap data yang disimpannya.
Indeks array selalu dimulai dari 0 dan perlu diketahui juga, indeks tidak selalu dalam
bentuk angka. Bisa juga karakter atau teks.
Cara membuat array kosong:
// cara pertama
String[] nama;
// cara kedua
String nama[];
// cara ketiga dengan kata kunci new
String[] nama = new String[5];
Parhatikan:
Kita menggunakan kurung siku [] untuk membuat array;
MODUL JAVA SCRIPT 1
Kurung siku bisa diletakkan setelah tipe data atau nama array;
Angka 5 dalam kurung artinya batas atau ukuran array-nya.
Array yang kosong siap diisi dengan data. Pastikan mengisinya dengan data yang sesuai
dengan tipe datanya.
Kita bisa mengisinya seperti ini:
nama[0] = "Linda";
nama[1] = "Santi";
nama[2] = "Susan";
nama[3] = "Mila";
nama[4] = "Ayu";
Atau kalau tidak mau repot, kita bisa membuat array dan langsung mengisinya.
String[] nama = {"Linda", "Santi", "Susan", "Mila", "Ayu"};
(1) Nomer indeks
(2) Mengubah element Array
MODUL JAVA SCRIPT 1
Jika kita ingin menggunakan Iterasi dengan array, kita bisa melakukannya dengan
cara seperti contoh berikut :
array fruits memiliki 3 element, untuk mem-print semua nilainya kita memerlukan
tiga code console.log(). Bandingkan dengan penggunaan loop for digambar kanan,
hasil yang sama dapat dicapai dengan lebih efisien. Ingat bahwa urutan array dihitung
dari 0, karena itulah kondisi loop dimulai dengan i = 0
1.14 OBJEK
Objek sebenarnya adalah sebuah variabel yang menyimpan nilai (properti) dan
fungsi (method).
Contoh objek mobil:
Bagaimana cara kita memodelkan mobil ini di dalam kode program?
Bisa saja seperti ini:
var car = "Mobil Fiat";
Tapi variabel car hanya akan menyimpan nama mobil saja. Karena itu, kita harus
menggunakan objek.
Objek pada javascript, dapat dibuat dengan tanda kurung kurawal dengan isi
berupa key dan value.
Contoh:
MODUL JAVA SCRIPT 1
Kode di atas bisa juga ditulis seperti ini:
var car = {
type:"Fiat",
model:"500",
color:"white"
};
Contoh lain :
MODUL JAVA SCRIPT 1
Object dibuat seperti berikut: {property1: nilai1, property2: nilai2}.
Bila element array ditempatkan dalam tanda kurung petak [ ], object harus ditempatkan
dalam tanda kurung kurawal {}. Selanjutnya, setiap property dan nilai object harus
dihubungkan dengan tanda titik dua (:), dan seperti array, setiap elementnya harus
dipisahkan dengan koma.
a. Nilai objek
objectName.propertyName
b. Mengupdate nilai objek
MODUL JAVA SCRIPT 1
objectName.propertyName = nilai baru
c. Objek dan array
Element array tidak harus berupa string, integer atau boolean, namun bisa juga sebagai
object. Berkat karakteristik ini, array seperti dalam gambar dikiri dapat dibuat. Disini,
untuk mencegah code menjadi terlalu panjang.
Untuk mengakses object didalam array ini, caranya sama seperti pada saat Anda mau
mengakses array lainya, gunakan arrayName[indexNumber].
arrayName[indexNumber].propertyName dapat digunakan untuk
memperoleh nilai property object yang disimpan dalam array. Seperti contoh dibawah
ini :
MODUL JAVA SCRIPT 1
d. Array dan Iterasi
1.15 UNDIFINED
Undefined adalah nilai khusus yang berarti nilai tidak bisa didefinisikan. Perhatikan
contoh berikut :
Cara mencegah undefined antara lain :
MODUL JAVA SCRIPT 1
Gunakan undefined dalam beberapa statement kondisional (if dan else). Kita akan
memiliki kontrol terhadap alur pada saat nilai character.age adalah undefined atau
tidak.
1.16 FUNCTION
Objek Function yang dibuat dengan konstruktor Function diuraikan ketika fungsi dibuat.
Hal tersebut kurang efisien dibandingkan dengan mendeklarasikan fungsi dengan function
expression atau function statement dan memanggilnya dengan kode Anda, karena fungsi-
fungsi tersebut diuraikan dengan sisa kode.
Semua argumen yang diteruskan ke fungsi diperlakukan sebagai nama identifier parameter
dalam fungsi yang akan dibuat, dalam urutan yang dilewatkan.
Catatan: Fungsi dibuat dengan konstruktor Function jangan membuat penutup pada
konteks kreasi mereka; Mereka selalu dibuat dalam ruang lingkup global. Saat
menjalankannya, mereka hanya bisa mengakses variabel lokal mereka sendiri dan variabel
global, bukan variabel dari ruang lingkup dimana konstruktor Function dipanggil. Berbeda
dari menggunakan eval dengan kode untuk fungsi ekspresi.
memanggil konstruktor Function sebagai sebuah fungsi (tanpa menggunakan
operatur baru) mempunyai efek yang sama seperti memanggilnya sebagai konstruktor
Untuk mendefinisikan function, ketik function(), lalu tulis hal yang Anda ingin function
tersebut lakukan didalam {} (tanda kurung kurawal).
Untuk memanggil function dalam contoh di bawah ini, tulis introduce ().
1.17 ARROW FUNCTION
Mendefinisikan function dengan () =>, ketimbang dengan function(), Function yang
didefinisikan dengan cara ini disebut arrow function (function panah).
Cara pengetikan arrow function tidak memerlukan perubahan apapun selain
menggantikan function() dengan () =>. Tidak ada perbedaan juga saat Anda memanggil
function yang didefinisikan dengan cara ini.
1.18 ARGUMENT
Argument adalah nilai data yang diteruskan ke function
Anda dapat menggunakan nilai function tersebut dengan meneruskan nilainya saat Anda
memanggil function tersebut. Nilai yang diteruskan saat Anda memanggil function
disebut argument, namun variable yang tertulis dalam definisi disebut parameter.
Seperti yang ditampilkan di bawah ini, argument dapat diteruskan ke function dengan
menuliskan nama parameter dalam tanda kurung, seperti ini (parameter) =>.
Untuk memanggil function yang menerima argument, tulis functionName (nilai).
Function akan menerima nilai yang ditunjuk dan nilai tersebut akan diberikan untuk
parameter. Pada gambar di sebelah kanan, nilai "Ninja Ken" diberikan untuk parameter
name saat memanggil function introduce.
Function dapat menerima beberapa argument. Anda dapat meneruskan beberapa argument
dengan menuliskannya bersama dalam tanda kurung dan memisahkannya dengan koma ,.
Dalam definisi function pada contoh gambar dikiri, parameter ditulis sebagai parameter1,
parameter2, ....
Nilai yang dihasilkan setelah function dipanggil, disebut nilai return. Sebagian besar
function digunakan untuk mengirim nilai return kembali ke tempat function tersebut
dipanggil. Di bawah ini, function add akan menerima 3 dan 7, lalu nilai return 10 akan
dihasilkan.
Mengembalikan nilai dengan menempatkan statement return di dalam function dengan
menulis nilai return. Hal ini akan memungkinkan function menghasilkan output sebagai
nilai return.
Cara menggunakan nilai return :
nilai boolean (true atau false) akan dikembalikan (return) jika anda menggunakan
statement kondisional. Ini sama seperti kondisi di statement if
Kita bisa menggunakan return untuk keluar dari sebuah function. Namun, penting
diketahui bahwa code dalam tanda kurung kurawal yang sama {}, yang terletak setelah
return tidak akan dijalankan.
1.19 Argument dari function dan constant yang didefinisikan di dalam sebuah
function hanya dapat digunakan didalam function tersebut. Dalam contoh dibawah ini,
constant name hanya dapat digunakan didalam function introduce, karena name
didefinisikan di dalam function tersebut. Jika Anda mencoba menggunakan constant
name diluar functionnya, error akan terjadi.
Jika constant didefinisikan di luar function, constant dapat digunakan didalam dan
diluar function. Dalam contoh dibawah ini, constant name didefinisikan di luar
function introduce, sehingga dapat digunakan didalam dan diluar function.
1.20 OBJECT
Object, seperti yang kita buat sebelumnya, biasanya digunakan saat membuat situs web.
Misalnya, layanan web yang memerlukan fungsi log in, seperti Progate, menggunakan
object untuk membuat data pengguna.
1.21 Blueprint Object
Untuk membuat object secara efisien, kita harus membuat "blueprint" (kerangka) object
tersebut. Misalnya, saat membuat data pengguna, data dapat dibuat dan disusun
berdasarkan "blueprint pengguna" yang telah disiapkan sebelumnya.
1.22 Contructor
Class sering memiliki method khusus yang disebut constructor. constructor digunakan
untuk memberikan nilai awal ke instance baru. Untuk menambahkan constructor ke class,
tulis constructor() { } di dalam tanda kurung kurawal {} class Animal seperti yang
ditunjukkan di bawah ini.
Code yang ditulis disana akan dipanggil saat instance dibuat. Hal penting untuk diingat
adalah code akan dipanggil untuk setiap instance. Karena new Animal() dipanggil dua
kali dalam gambar dibawah ini, konten dalam constructor akan dipanggil untuk keduanya.
Untuk menambahkan property dan nilai kedalam constructor, tulis this.property = nilai.
Instance adalah object. Jadi, dengan menulis instance.property, nilai yang ditambahkan
dalam constructor dapat digunakan diluar class tersebut.
Sama seperti function, constructor juga dapat menerima argument. Dengan menulis nama
argument di dalam tanda kurung () setelah constructor, argument yang ditetapkan dapat
digunakan didalam proses pemanggilan constructor terkait.
Saat nilai diteruskan ke constructor sebagai argument, nilai akan ditambahkan dalam
tanda kurung () milik new className().
Dalam contoh di bawah ini, nilai string "Leo" diteruskan sebagai argument dan dapat
diakses sebagai name dalam constructor.
1.23 METHOD
Method bisa dibilang seperti "aksi" milik sebuah instance. Jika data seperti name dan age
dapat ditambahkan menggunakan property, method dapat mengekspresikan seluruh
kumpulan instruksi seperti memberikan salam dan menghitung nilai. Method
dideklarasikan dalam class dengan menulis methodName() { }.
Sama seperti function, code dalam method harus dituliskan didalam {}.
Method dipanggil untuk instance yang dibuat didalam class. Misalnya, dengan
menuliskan instance.methodName() seperti contoh di bawah ini, method greet didalam
object Animal, akan dipanggil dan dijalankan untuk instance animal.
Dengan menggunakan nilai name, ayo kita buat method untuk mem-print string Nama
saya adalah ____. Saat Anda ingin menggunakan nilai instance didalam method, tulis
this.propertyname, menggunakan nilai khusus this.
Anda juga dapat memanggil method dalam method lain.Seperti contoh di bawah ini,
method lain dalam class yang sama dapat digunakan dengan menuliskan
this.methodName() dalam method tersebut.
1.24 INHERITANCE CLASS
Inheritance atau Pewarisan/Penurunan adalah konsep pemrograman dimana
sebuah class dapat‘menurunkan’ property dan method yang dimilikinya kepada class lain.
Konsep inheritance digunakan untuk memanfaatkan fitur ‘code reuse’ untuk menghindari
duplikasi kode program.
Konsep inheritance membuat sebuah struktur atau ‘hierarchy’ class dalam kode
program. Class yang akan ‘diturunkan’ bisa disebut sebagai class induk (parent class),
super class, atau base class. Sedangkan class yang ‘menerima penurunan’ bisa disebut
sebagai class anak (child class), sub class, derived class atau heir class.
Tidak semua property dan method dari class induk akan
diturunkan. Property dan method dengan hak akses private, tidak akan diturunkan kepada
class anak. Hanya property dan method dengan hak akses protected dan public saja yang
bisa diakses dari class anak.
uatu class yang mempunyai class turunan dinamakan parent class atau base class.
Sedangkan class turunan itu sendiri seringkali disebut subclass atau child class. Suatu
subclass dapat mewarisi apa-apa yang dipunyai oleh parent class.
Karena suatu subclass dapat mewarisi apa apa yang dipunyai oleh parent class-nya, maka
member dari suatu subclass adalah terdiri dari apa-apa yang ia punyai dan juga apa-apa
yang ia warisi dari class parent-nya.
Kesimpulannya, boleh dikatakan bahwa suatu subclass adalah tidak lain hanya
memperluas (extend) parent class-nya.
Dari hirarki diatas dapat dilihat bahwa, semakin kebawah, class akan semakin bersifat
spesifik. Class mamalia memiliki seluruh sifat yang dimiliki oleh binatang, demikian
halnya juga macan , kucing, Paus dan Monyet memiliki seluruh sifat yang diturunkan dari
class mamalia.
Dengan konsep ini, karakteristik yang dimiliki oleh class binatang cukup didefinisikan
didefinisikan dalam class binatang saja.
Class mamalia tidak perlu mendefinisikan ulang apa yang telah dimiliki oleh class
binatang, karena sebagai class turunannya, ia akan mendapatkan karakteristik dari class
binatang secara otomatis. Demikian juga dengan class macan, kucing, Paus dan monyet,
hanya perlu mendefinisikan karakteristik yang spesifik dimiliki oleh class-nya masing-
masing.
Dengan memanfaatkan konsep pewarisan ini dalam pemrograman, maka hanya perlu
mendefinisikan karakteristik yang lebih umum akan didapatkan dari class darimana ia
diturunkan.