pemrograman berbasis web 4 - javascript
TRANSCRIPT
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
1/55
Pemrograman BerbasiPertemua
Program Diploma IPB - Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
2/55
Overview Pendahuluan Pengaksesan Javascript
Dasar Javascript
Program Diploma IPB - Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
3/55
Apa yang harus Anda sudah ketahui ?
HTML & CSSProgram Diploma IPB - Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
4/55
Javascript
Bukan Java. Javascript dikembangkan oleh Netscape sedangkadikembangkan oleh Sun
Dirancang untuk plug a gap dalam tekniknya
Client Side Dynamic Content
Diinterpretasi
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
5/55
Javascript
Dirancang untuk menambah interaktifitas kedalam halaman HT
Merupakan scripting language
Dapat ditanam langsung di halaman HTML
Dapat digunakan setiap orang tanpa harus membayar lisensi
Didukung oleh sebagian besar browser
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
6/55
Javascript
Mengakhiri statement dengan titik koma (;) merupakan opsionjavascript
Case sensitive
Javascript mengabaikan spasi tambahan
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
7/55
Pengaksesan Javascript
Inline
Internal
Eksternal
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
8/55
Inline
Jangan Klik !
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
9/55
Internal
document.write(Hello World!);
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
10/55
Eksternal
Index.html
Script.js
document.write(Hello World!);
Program Diploma IPB - Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
11/55
Memecah baris kode
document.write("Hello \
World!");
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
12/55
Komentar
//Komentar satu baris
/*
KomentarMulti
Baris
*/
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
13/55
Variabel
Nama variabel harus diawali huruf
Nama variabel juga dapat diawali dengan $ dan _
Nama variabel case sensitive
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
14/55
Contoh Variabel
var x=5;var y=6;var z=x+y;
var lastname=Wicaksono",age=26,job=Dosen";
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
15/55
Array
//Cara 1
var cars=new Array();
cars[0]="Saab";cars[1]="Volvo";cars[2]="BMW";
//Cara 2
var cars=new Array("Saab","Volv
//Cara 3
var cars=["Saab","Volvo","BMW"
Program Diploma IPB - Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
16/55
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
17/55
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
18/55
Contoh Fungsi
function myFunction(){alert("Hello World!");}
Try it
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
19/55
Fungsi dengan Argumen
function myFunction(var1,var2){
some code}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
20/55
Contoh Fungsi dengan Argumen
Try it
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
21/55
Fungsi dengan Return Value
function myFunction(){
var x=5;return x;}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
22/55
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
23/55
Variabel Global
Variabel yang dideklarasikan di luar fungsi
Dapat diakses dari semua script dan fungsi pada halaman web
Jika memberikan nilai ke variabel yang belum dideklarasikan, mtersebut akan secara otomatis dinyatakan sebagai variabel glob
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
24/55
Lifetime Variabel
Lifetime variabel dimulai ketika dideklarasikan
Variabel local akan dihapus saat fungsi selesai Variabel global akan dihapus bila halam ditutup
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
25/55
Operator
= digunakan untuk menetapkan nilai
+ digunakan untuk menambahkan nilai
+ juga dapat digunakan untuk menambahkan variable string atbersamaan
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
26/55
Contoh Operator
y=5;
z=2;
x=y+z;
// Isi variable x = 7
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
27/55
Contoh Operator
txt1="What a very ";txt2="nice day";txt3=txt1+txt2;
// Isi variable txt3 = What a very nice day
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
28/55
Contoh Operator
x=5+5; // Isi variabel x = 10y="5"+5; // Isi variabel y = 55z="Hello"+5; // Isi variabel z = Hello5
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
29/55
Arithmetic Operator
Operator Deskripsi
+ Addition
- Subtraction
* Multiplication
/ Division% Modulus (sisa hasil bagi)
++ Increment
-- Decrement
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
30/55
Assignment Operator
Operator
=
+=
-=
*=/=
%=
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
31/55
Comparison Operator
Operator Deskripsi
== equal to
=== exactly equal to (equal value and e
!= not equal
!== not equal (different value or differ
> greater than< less than
>= greater than or equal to
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
32/55
Logical Operator
Operator Deskripsi
&& And
|| Or
! Not
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
33/55
Conditional Operator
variablename = (condition) ? value1 : value2
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
34/55
Contoh Conditional Operator
voteable = (age < 18) ? "Too young : "Old enough";
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
35/55
Conditional Statement
if statement
if else statement
if else if else statement
switch statement
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
36/55
if statement
if (condition)
{
code to be executed if condition is true
}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
37/55
Contoh
if (time
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
38/55
if else statement
if (condition)
{
code to be executed if condition is true
}
else{
code to be executed if condition is not true
}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
39/55
Contoh
if (time
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
40/55
if else if else statement
if (condition1)
{
code to be executed if condition1 is tr ue
}
else if (condition2)
{
code to be executed if condition2 is tr ue
}
else
{
code to be executed if neither condition1 nor condition2 is true
}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
41/55
Contoh
if (time
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
42/55
switch statement
switch(n)
{
case 1:
execute code block 1
break;
case 2:
execute code block 2
break;
default:
code to be executed if n is different from case 1 and 2
}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
43/55
Contoh
var day=new Date().getDay();switch (day){case 0:x="Today it's Sunday";break;
case 1:x="Today it's Monday";break;
case 2:x="Today it's Tuesday";break;
case 3:x="Today it's Wednesday";break;
case 4:x="Today it's Thursday";break;
case 5:x="Today it's Friday";break;
default:x="Today it's Saturday";
}
Program Diploma IPB - Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
44/55
Loop
for
for in
while
do while
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
45/55
for loop
for (statement 1; statement 2; statement 3)
{
the code block to be executed
}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
46/55
Contoh
for (var i=0; i
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
47/55
for in loop
for (variable in object)
{
code to be executed}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
48/55
Contoh
var person={fname:Aditya",lname:Wicaksono",age:26};
for (x in person)
{txt=txt + person[x];
}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
49/55
while loop
while (condition)
{
code block to be executed}
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
50/55
Contoh
while (i
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
51/55
do while loop
do
{
code block to be executed
}
while (condition);
Program Diploma IPB -Aditya Wicaksono, S.Komp
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
52/55
Contoh
do
{
x=x + "The number is " + i + "
";i++;}
while (i
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
53/55
break statement
for (i=0;i
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
54/55
continue statement
for (i=0;i
-
8/10/2019 Pemrograman Berbasis Web 4 - Javascript
55/55