Bahasa Pemrograman Script
Augury El Rayeb, S.Kom., MMSI. Pengolahan Informasi Berbasis Script | IST209
Conditional
•
Selection dengan
if
if (<kondisi>) {
<statement_kondisi_terpenuhi>
}
Contoh:
var age = 10;
if(age < 12) {
•
Selection dengan
if…
else…
if (<kondisi>) {
<statement_kondisi_terpenuhi>
}
else {
<statement_kondisi_tidak terpenuhi>
}
alert("Bukan anak-anak"); }
Augury El Rayeb, S.Kom., MMSI. Pengolahan Informasi Berbasis Script | IST209
•
Selection dengan
if…
else if… else…
if (<kondisi1>) {
<statement_kondisi_terpenuhi>
}
else if (<kondisi2>){
<statement_kondisi1_tdk_terpenuhi_kondisi2_terpenuhi>
else:
Operator Relasional
(Komparasi)
Operator
Name
Example
===
equality
'50‘ === 50 // false
50 === 50 // true
!==
non-equality
'50‘ !== 50 // true
50 !== 50 // false
>
<
greater than
Less than
'50‘ > 40 // true
alert(“You're older than 18!");
}
var age = 20;
if(age > 18) {
alert(“You're older than 18!");
}
var name = "Jack";
if(name === "Jack") {
alert("Hello Jack");
}
var name = "Jack";
if(name === "Jack") {
Operator Logika
var name = "Jack";
var age = 20;
if(age > 18 && name === "Jack") {
alert("Hello Jack, you're older than 18!");
}
var name = "Jack";
var age = 20;
if(age > 18 && name === "Jack") {
Array
Deklarasi Array:
var classMates = ["Jack", "Jamie", "Rich", "Will"];
Mengambil Isi Array:
var teman2 = classMates[1]; //Jamie
Deklarasi Array Dua Dimensi:
var twoDArray = [
["Jack", "Jon", "Fred"],
["Sue", "Heather", "Amy"]
];
Mengambil Isi Array Dua Dimensi:
Augury El Rayeb, S.Kom., MMSI. Pengolahan Informasi Berbasis Script | IST209
Array
Method
push
(untuk menambah elemen isi array):
classMates.
push
("Catherine");
Menghapus Elemen Isi Array:
delete
classMates[1];
Method length:
var twoDArray = [
["Jack", "Jon", "Fred"],
["Sue", "Heather", "Amy"]
];
Mengambil Isi Array Dua Dimensi:
Loops
•
For loops:
for(before loop; condition; iteration) {
//code
}
•
Contoh:
for(var i = 0; i < 10; i++) {
alert(i);
}
•
Contoh for untuk array:
for(var i = 0; i <
classMates.length
; i++) {
Augury El Rayeb, S.Kom., MMSI. Pengolahan Informasi Berbasis Script | IST209
Loops
•
While loops:
while(condition) {
//code
}
•
Contoh:
var count = 0;
while(count < 5) {
alert(count);
count++;
}
•
Contoh for untuk array:
var count = 0;
while(count < classMates.length) {
alert(classMates[count]);
DOM
•
hirarki object model pada browser:
window
document
Body
Style Event
Frame History Location Navigator
Augury El Rayeb, S.Kom., MMSI. Pengolahan Informasi Berbasis Script | IST209
DOM dan Javascript
•
Property dan Method pada Object
Window:
▫Property status
▫Method alert( )
DOM
Augury El Rayeb, S.Kom., MMSI. Pengolahan Informasi Berbasis Script | IST209
DOM
-
Contoh object model pada dokumen
HTML
<html>
<head>
<title> :: Welcome ::</title>
</head>
<body>
<ul class="right">
<li class="has-dropdown">
<a href="#">about</a>
<ul class="dropdown">
<li><a href="#">about me</a></li>
</ul>
</li>
<li class="has-dropdown">
<a href="#">UI Tech</a>
<ul class="dropdown">
<li><a href="#">CSS</a></li>
</ul>
</li>
<li>
<a href="#">contact</a>
</li>
DOM dan Javascript
•
Property dan Method pada Object
Document:
▫Method document.createElement()
▫Method document.getElementById()
▫Method
document.getElementsByClassName()
▫Method
document.getElementsByTagName()
Augury El Rayeb, S.Kom., MMSI. Pengolahan Informasi Berbasis Script | IST209
DOM dan Javascript
•
Property dan Method pada Object
Document:
▫Method document.createElement()
Contoh:
<script>
var divTambahan = document.createElement('div');
divTambahan.id="idDivBaru";
divTambahan.innerText = "ini DIV tambahan";
document.body.appendChild(divTambahan);
DOM dan Javascript
•
Property dan Method pada Object Document:
▫Method document.getElementById()
Contoh:
<script>
function ubah() {
document.getElementById("noSatu").innerText='Teks Baru';
}
</script>
<body>
<div id=“noSatu">Teks Awal</div>
Augury El Rayeb, S.Kom., MMSI. Pengolahan Informasi Berbasis Script | IST209