Haikal PG - XI RPL 1 - PWPB Sesi 14

Assalamualaikum Warahmatullahi Wabarokatuh
Pada sesi kali ini kita akan membahas tentang penerapat struktur kontrol percabangan. Sistem percabangan terbagi menjadi 4 yaitu :

IF
ELSE IF
ELSE
SWITCH

IF digunakan jika hanya memiliki satu pernyataan yang akan dijalankan dengan syarat tertentu. Contoh IF sebagai berikut

ELSE IF digunakan saat kita memiliki banyak kondisi (2 atau lebih) pernyataan. Contoh ELSE IF sebagai berikut

Else If

ELSE digunakan jika pernyataan yang disyaratkan semuanya tidak terpenuhi maka block ELSE ini akan dijalankan. Contoh penggunaan ELSE

Else

SWITCH adalah sebuah struktur percabangan yang akan memeriksa suatu variabel, lalu menjalankan perintah-perintah yang sesuai dengan kondisi yang mungkin terjadi untuk variabel tersebut.Contoh penggunaan SWITCH

Switch

Ok itu dia macam macam struktur kontrol percabangan. Sekarang kita akan memulai latihannya :

if1Umur.html

Kita akan membuat if untuk mengecek sebuah umur. Contohnya jika umur kurang dari 17 maka ia dilarang mengikuti pemilu dan jika umur lebih dari 17 ia bisa mengikuti pemilu. Untuk lebih jelasnya lihat contoh code berikut :

HTML dan Embedded JS

<!DOCTYPE html>
<html>
<head>
 <title>Haikal Putra Gutiansyah XI RPL 1 Bua</title>
 <link rel="stylesheet" type="text/css" href="css/Buatif.css">
</head>
<body>
 <p id="cobaan">
<script type="text/javascript">
   var umur;
   umur = prompt("Masukkan umur anda : ");
   umur = parseInt(umur);
   if (umur < 17) {
    alert("Kami belum dapat mengikuti pemilu");
   }
   alert("Kamu dapat mengikuti pemilu");
  </script>
 </p>
</body>
</html>

CSS

body{
 background-color: orange;
}
p{
 color: white;
 text-align: center;
 font-family: consolas;
}
script{
 font-family: cursive;
 color: red;
}

Jika kode diatas dijalankan maka akan ada tampilan seperti berikut:

Tampilan di atas ditampilkan dengan prompt dan kemudian dimasukkan kedalam variable umur. Setelah dimasukkan maka akan ada IF-ELSE yang akan mengecek umur. Jika umur lebih dari 17 maka akan mucnul alert/pesan sebagai berikut :

Jika kurang dari 17 maka akan mucul alert/pesan sebagai berikut :

Gimana mudah bukan?

if2Olahraga.html
Kita coba buat lagi if nya dengan code sebagai berikut :
HTML dan Embedded JS

<!DOCTYPE html>
<html>
<head>
 <title>Haikal Putra Gustiansyah XI RPL 1 if2Olahraga</title>
 <link rel="stylesheet" type="text/css" href="css/Buatif.css">
</head>
<body>
 <p id="coba">
<script type="text/javascript">
  var olahraga;
  olahraga = prompt("Masukkan olahraga yang kamu sukai?, terjun payung atau sepeda gunung");
  if (olahraga == "terjun payung" || olahraga == "sepeda gunung") {
   alert("Kami menyukai olahraga ekstrim");
  }
 </script>
 </p>
</body>
</html>

CSS

body{
 background-color: orange;
}
p{
 color: white;
 text-align: center;
 font-family: consolas;
}
script{
 font-family: cursive;
 color: red;
}

Jika dijalankan maka tamplanya akan seperti :

Jika kita mengisi dengan terjun payung atau sepeda gunung maka akan tampil seperti berikut :

if3-jam.html
Di Javascript juga bisa mengambil date/tanggal dan hours dengan method yang sudah disediakan oleh Javascript. dengan date(); newHours();. Kita akan coba buat sebuah pernyataan jika jam kurang dari 18:00 akan menampilkan pesan Good Day! dan jika lebih akan tampil Good Evening. Contoh tampilan.

IF+ELSE.html
Kita coba lagi buat dengan function date() dan Hours() kita buat lagi seperti diatas.Ini codenya:

IF+ELSE IF+ELSE.html
Kita coba lagi hehe dengan IF-ELSE IF-ELSE. Ini codenya :

SWITCHCASE1-PULSA.html
Kita coba menggunakan SWITCH, hasilnya sama seperti IF-ELSE IF-ELSE namun penulisannya jadi lebih singkat jika menggunakan SWITCH ini. Codenya:

HTML dan Embedded JS

<!DOCTYPE html>
<html>
<head>
 <title>Haikal Putra Gustiansyah XI RPL 1 SwitchCase1-Pulsa</title>
</head>
<body>
 <script type="text/javascript">
  var pilihan = prompt("Pilihan untuk cek pulsa\n1. Informasi pulsa anda\n2.Informasi masa aktif dan masa tenggang")
  pilihan = parseInt(pilihan);
  switch(pilihan){
   case 1: alert("Jumlah pulsa andas adalah sembilah belas ribu rupiah");
   break;
   case 2: alert("Masa aktif kartu anda hingga 7 Agustus 2019");
   break;

   default:
   alert("Pilihan sesuai nomor yang ada");
   break;
  }
 </script>
</body>
</html>

CSS

body{
 background-color: orange;
}
p{
 color: white;
 text-align: center;
 font-family: consolas;
}
script{
 font-family: cursive;
 color: red;
}

Jika code diatas dijalankan maka tampilannya :

Jika kita menuliskan pada prompt dengan angka 1 maka akan seperti ini:

Jika kita isi dengan angka 2:

Dan jika tidak keduanya maka block default akan dijalankan dengan pesan "Pilihan sesuai no yang ada";

SWITCHCASE2-RMPADANG.html
Sekarang kita coba buat dengan opsinya menu-menu makanan padang. Jika di pilih maka akan ada alert makanan yang dipilih. Codenya :
HTML dan Embedded JS

<!DOCTYPE html>
<html>
<head>
 <title>Haikal Putra Gustiansyah XI RPL 1 SwitchCase2-RMPADANG</title>
 <link rel="stylesheet" type="text/css" href="css/Buatif.css">
</head>
<body>
 <script type="text/javascript">
  alert("MENU MAKANAN PADANG\nSILAHKAN PILIH MENU YANG DIINGINKAN\n\n Klik ok untuk melanjutkan");

  var pilihan = prompt("1.Rendang........................Rp.14.000\n2.Ikan Balado ..........................Rp.13.000\n3. Dendeng Balado......................Rp.12.000\nSoto Padang\n4. Soto Padang ...................Rp.15.000\n5. Gulai.......................Rp.20.000");

  pilihan = parseInt(pilihan);

  switch(pilihan){
   case 1: alert("Menu yang anda pilih : rendang");
   break;
   case 2: alert("Menu yang anda pilih : Ikan Balado");
   break;
   case 3: alert("Menu yang anda pilih : Dendeng Balado");
   break;
   case 4: alert("Menu yang anda pilih : Soto Padang");
   break;
   case 5: alert("Menu yang anda pilih : Gulai");
   break;
   default:alert("Menu yang anda pilih : tidak ada/Silahkan pilih menu yang lain terimakasih");
  }
 </script>
</body>
</html>

CSS

body{
 background-color: orange;
}
p{
 color: white;
 text-align: center;
 font-family: consolas;
}
script{
 font-family: cursive;
 color: red;
}

Jika kode diatas dijalankan maka akan ada tampilan berikut :

Jika kita pilih salah satu opsi diatas maka akan tampil seperti berikut, contoh :

Maka akan ada alert menu yang dipilih.

QUIZZ 14

Buatlah sebuah halaman sederhana yang berisi menu-menu perhitungan aritmatika
Menggunakan funsi if-elseif-else / switch case
Menu perhitungan minimal 5 perhitungan
Menggunkan input dari keyboard (prompt)
Posting di Blog, hanya hasilnya saja tanpa coding.

Hasilnya :

Input 1

Memilih operator

Input 2

Hasil

Begitulah......

Coba kalian buat seperti foto diatas.. hehe..

Sekian pada pertemuan kali ini, Wassalamualaikum Warahmatullahi Wabarokatuh.

Haikal PG - XI RPL 1 - PWPB Sesi 38

Assalamualaikum Warahmatullahi Wabarokatuh Halo teman-teman gimana kabarya? semoga sehat selalu ya.. . Pada sesi kali ini kita akan membahas tentang overloading. Overloading Overloading di PHP menyediakan cara agar properti dan method dapat dibuat secara dinamis. Entitas dinamis ini diproses melalui method ajaib yang dapat dibangun di class untuk berbagai jenis tindakan. method overloading dipanggil saat berinteraksi dengan properti atau method yang belum dideklarasikan atau tidak terlihat dalam baris program. Sisa dari bagian ini akan menggunakan istilah properti dan method yang tidak dapat diakses untuk merujuk pada kombinasi deklarasi dan visibilitas tersebut. Semua method overloading harus didefinisikan sebagai public. Contoh overloading dengan isset,unset,set, dan get.: data[$name] = $value; } public function __get($name) { echo "Getting".$name."\n"; if (array_key_exists($name, $this->data)) { return $this->data[$name]; } $tra...

Baca selengkapnya

Pemrograman Web Dan Perangkat Bergerak

Cari Blog Ini

Haikal PG - XI RPL 1 - PWPB Sesi 14

Komentar

Posting Komentar

Postingan populer dari blog ini

Haikal PG - XI RPL 1 - PWPB Sesi 9

Haikal PG - XI RPL 1 - PWPB Sesi 38

Haikal PG - XI RPL 1 - PWPB Sesi 25