Scribd
Unggah
8 tayangan

Intro To Programming Week 1

Diunggah oleh

kevin.pahlawan1208
Hak Cipta
© © All Rights Reserved
Format Tersedia
Unduh sebagai PPTX, PDF, TXT atau baca online di Scribd
8 tayangan

Intro To Programming Week 1

Diunggah oleh

kevin.pahlawan1208
Hak Cipta
© © All Rights Reserved
Format Tersedia
Unduh sebagai PPTX, PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 19

INTRO TO

PROGRAMMING Week 1

JAVASCRIPT
SEBELUM MEMULAI TRAINING

 Silahkan buat 1 file notepad (.txt) untuk menyimpan catatan dan


penjelasan dari materi yang diajarkan
 Pastikan sudah install Visual Studio Code. Dari Code Editor
tersebut, kita akan buat file berekstensi .html
 Download Extensions “open in browser” di Visual Studio Code
HTML

 HTML = HyperText Markup Language


 Merupakan suatu bahasa markah yang digunakan untuk
membuat halaman web, menampilkan berbagai informasi di
dalam browser web
 Contoh:
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
<p> <i>HyperText Markup Language</i>
(HTML) merupakan sebuah standar yang digunakan secara luas untuk
menampilkan halaman di <i> browser web</i>
</p>
</body>
</html>
JAVASCRIPT

 Javascript adalah salah satu bahasa pemrograman yang bisa


digunakan dalam pemgembangan aplikasi berbasis web
 Umumnya Javascript digunakan pada web browser untuk
menciptakan halaman web yang menarik , interaktif ser ta
menerapkan berbagai fungsi pada halaman web
 Javascript dapat disisipkan ke dalam HTML, baik disisipkan secara
langsung maupun diletakkan ke dalam file .js dan disisipkan dari
dokumen HTML
 JavaScript membutuhkan ; (titik koma) di akhir penulisan
codingannya
 Contoh:
<body>
<script>
document.write(“selamat pagi”);
</script>
</body>
VARIABEL

 Dalam dunia programming, variabel adalah sebuah tempat


penyimpanan nilai / data / value
 Nilai yang tersimpan di dalam variabel, dapat berupa teks, angka,
kondisi true / false, dll
 Umumnya, ada beberapa tipe data yang bisa disimpan ke dalam
sebuah variabel, diantaranya:
- Char  Character (abjad / karakter)
- String  Teks
- Integer  Angka bulat (tidak ada koma)
- Float  Angka (ada koma) max digit: 7
- Double  Angka (ada koma), range angka lebih besar dari
pada float [2x lebih besar dari Float] max digit: 15
- Boolean  Menyimpan kondisi benar / salah (true / false)
- Array  Kumpulan data yang bisa lebih dari 1 . Contoh:
Array (of string) , ar tinya kumpulan data ber tipe String
VARIABEL

 Khusus JavaScript, beberapa tipe data yang bisa disimpan ke


variabel, diantaranya:
- string
- number
- boolean
- any
- object

Contoh:
String  var namaSiswa = “Budi”;
Number  var nilaiSiswa = 80;
Boolean  var lulus = true;
Any  var product;
Object  var array_nama_hewan = [“kucing”, “kelinci”, “gajah”];
*Array masuk kategori Object*
VARIABEL

 Aturan dalam penamaan variabel:


- Tidak boleh ada spasi
- Diawali menggunakan huruf kecil, baru setelah itu bisa pakai huruf
besar
- Karakter per tama tidak boleh angka
- Tidak boleh pakai karakter spesial. Hanya bisa alphanumeric dan
under score
- Bersifat case sensitive. Contoh: namahewan, namaHewan,
NAMAHEWAN  dianggap variabel yang berbeda-beda (jadi ada 3
variabel)
VARIABEL

- Ada 2 pendekatan dalam memberi nama variabel:


- Camel case : hurufnya besar kecil.
Contoh:
namaOrangTuaSiswa
nilaiUjian1
- Snake case : huruf kecil semua, dipisah pakai under score
Contoh:
nama_orang_tua_siswa
nilai_ujian_1

 Misalnya kita mengganti nama variabel ( rename). Maka codingan yang


menggunakan (referensi) variabel tersebut, harus ikut diubah.
 Jika tidak , maka codingan menjadi error karena tidak mengenali nama
variabelnya lagi. Maka dari itu, kita disarankan melakukan rename
melalui fitur “Rename Symbol”
OPERATOR PERHITUNGAN (ARITHMETIC)

 *  (perkalian)
 /  (pembagian)
 Math.pow(angka, pangkat)  (perpangkatan)
Contoh: var result = Math.pow(2, 3); //result = 8
 Math.sqr t(angka)  akar kuadrat.
Contoh: var result = Math.sqr t(25); //result = 5
 + -  (per tambahan & pengurangan)
 Operasi yang lain bisa menggunakan Math.(nama fungsinya)

 Contoh:
var nilai1 = 85;
var nilai2 = 62.5;
var nilaiRata2 = (nilai1 + nilai2) / 2; //hasilnya : nilaiRata2 = 73.75

var hasilAkarDari = Math.sqr t(25); //hasilnya : hasilAkarDari = 5


OPERATOR PENUGASAN (ASSIGNMENT)
OPERATOR PENUGASAN (ASSIGNMENT)

 Contoh:
var x = 3;
x+=2 ;  (sama artinya dengan x = x + 2)
Artinya x yang awalnya 3, ditambah 2, maka sekarang nilai
akhir x adalah 5

var y = 5;
y*=3;  (sama artinya dengan y = y * 3)
Artinya y yang awalnya 5, dikali 3, maka sekarang nilai akhir y
adalah 15
OPERATOR KOMPARASI (COMPARATION)

 >  greater than (lebih besar dari)


 <  less than (lebih kecil dari)
 >=  Greater than or equal to (lebih besar sama dengan dari)
 <=  Less than or equal to (lebih kecil sama dengan dari)
 ==  sama dengan (membandingkan nilai)
 !=  tidak sama dengan (membandingkan nilai)
OPERATOR KOMPARASI (COMPARATION)

 Contoh:

 ==
 if (nilai_ujian == 70) {
var teks = “Nilai ujian Anda = 70”;
}
 “==“ itu untuk membandingkan nilai. Apabila value dari nilai_ujian adalah
70, maka masuk ke dalam if. Jika nilai_ujian bukan 70, maka tidak masuk
ke if.

 !=
 if (nilai_ujian != 70) {
var teks = “Nilai ujian Anda bukan 70”;
}
 “!=“ untuk membandingkan nilai. Apabila value dari nilai_ujian BUKAN 70,
maka masuk ke dalam if. Jika nilai_ujian adalah 70, maka tidak masuk ke if.
OPERATOR LOGIKA

 &&  and (dan)


 ||  or (atau)
 !  tidak / bukan
OPERATOR LOGIKA

 Contoh:

 &&  if (nilai1 > 70 && nilai2 >= 60) { }


 “&&” itu harus 2 kondisi kiri dan kanan sama-sama memenuhi (true),
baru bisa masuk ke kondisi if

 ||  if (warna == “merah” || warna == “hijau”) { }


 “||” itu jika salah satu kondisi kiri atau kanan memenuhi, maka akan
masuk ke kondisi if. Jika kiri dan kanan tidak memenuhi sama sekali,
barulah tidak masuk ke if

 !  var lulus = !(nilai1 < 70)


 “!” itu kondisi kebalikan. Misalnya kasus di atas, apabila nilai1 < 70 =
false, maka karena ada ! nya menjadi true. Sehingga kondisi agar bisa
masuk ke if adalah nilai1 harus lebih besar dari 70
 !true = false
 !false = true
KONDISI (CONDITION)

 Membuat kondisi bisa dengan 2 cara:


 If else
 Switch

 Untuk membuat condition (terutama if else), biasanya


memanfaatkan operator komparasi dan operator logika
IF ELSE

 If else merupakan pemrograman kondisional


 Jika pakai if, tidak selalu harus ada else
 Jika ada else, maka jika kondisi if tidak memenuhi, logika
coding akan masuk ke else
 Urutan logika dibaca dari kondisi paling atas
 Susunan urutan mempengaruhi hasil, maka buat kondisi yang
terpenting / terbesar di bagian atas

 Ada 3 susunan:
- if
- else if
- else
SWITCH

 Pemrograman kondisional selain menggunakan if


 Switch diikuti dengan case untuk membuat kondisi-kondisinya
 Biasanya setelah masuk ke case, ditutup dengan “break”,
supaya proses switchnya terhenti

switch(condition-nya) {
case options1:
break;
case options2:
break;
default:
break;
}
TUGAS DAN LATIHAN

 Kerjakan latihan soal dan logika di folder:


 “Tugas”  Pertemuan 2

Anda mungkin juga menyukai