Frontend : JAVASCRIPT Bagian 8 – Alur Percabangan Program (IF Condition)

Masih semangat?? Jika sudah tidak semangat teman-teman bisa rileks dulu sambil mengumpulkan semangat kalian kembali. Untuk menjadi rileks kalian bisa bermain game terlebih dahulu, atau apapun kegiatan yang kalian suka. Penulis beri waktu 30 menit. Oke sudah 30 menit ya >,<. Yuk masuk ke pembahasan. Alur Percabangan atau biasa disebut dengan IF Condition dalam dunia pemrograman adalah salah satu cara untuk mengatur perintah program yang akan dijalankan. Contoh Studi Kasus Login. Teman-teman login tokopedia. Ketika teman-teman memasukkan email dan password dengan benar, maka akan masuk ke akun yang sudah tertera. JIKA email dan password salah, teman-teman tidak dapat masuk ke akun yang sudah tertera. Inilah yang dinamakan Alur Percabangan Program. Terdapat 4 cara untuk membuat IF Condition :


1. If

Digunakan untuk membuat alur percabangan program dasar. Paling sering digunakan pada umumnya.

<!DOCTYPE html>
<html>
<head>
	<link rel="icon" type="image/x-icon" href="img/pbs2.png">
	<title>Frontend : JAVASCRIPT Bagian 8 - Alur Percabangan Program (IF Condition)</title>
</head>
<body>
<h4>JAVASCRIPT Bagian 8 - Alur Percabangan Program (IF Condition)</h4>

<!-- Kode Javascript -->
<script type="text/javascript">
	var password = 12345678;
	var input = 12345678;
	if(input == password)
	{
		console.log('Perintah IF Dijalankan!');
	}
</script>
</body>
</html>


Penjelasan :

1. Baris 12, password adalah 12345678

2. Baris 13, kita meng-input password menjadi 12345678

3. Baris 14 – 17, kita membuat sebuah alur percabangan program dengan IF

4. Baris 16 dijalankan karena IF Condition terpenuhi


Hasil :


2. Else

Else adalah IF Condition yang akan dijalankan apabila IF tidak terpenuhi.

<!DOCTYPE html>
<html>
<head>
	<link rel="icon" type="image/x-icon" href="img/pbs2.png">
	<title>Frontend : JAVASCRIPT Bagian 8 - Alur Percabangan Program (IF Condition)</title>
</head>
<body>
<h4>JAVASCRIPT Bagian 8 - Alur Percabangan Program (IF Condition)</h4>

<!-- Kode Javascript -->
<script type="text/javascript">
	var password = 12345678;
	var input = 87654321;
	if(input == password)
	{
		console.log('Perintah IF Dijalankan!');
	}else{
		console.log('Perintah ELSE Dijalankan!');
	}
</script>
</body>
</html>


Penjelasan :

1. Baris 12, password adalah 12345678

2. Baris 13, teman-teman meng-input password menjadi 87654321

3. Baris 14 – 19, kita membuat Alur Percabangan Program

4. Baris 14, kita membuat Alur Percabangan Program dengan variabel input dan password

5. Baris 16, akan TRUE(ditampilkan) apabila variabel input dan password sama

6. Baris 17, jika Baris 14 tidak terpenuhi, maka else dibutuhkan

7. Baris 18, akan TRUE(ditampilkan) apabila variabel input dan password tidak sama


Hasil :


3. Else If

Elseif bentuk lain dari IF jika ingin membuat alur percabangan program lebih dari 1 alur. Alur ini akan dijalankan jika If tidak terpenuhi.

<!DOCTYPE html>
<html>
<head>
	<link rel="icon" type="image/x-icon" href="img/pbs2.png">
	<title>Frontend : JAVASCRIPT Bagian 8 - Alur Percabangan Program (IF Condition)</title>
</head>
<body>
<h4>JAVASCRIPT Bagian 8 - Alur Percabangan Program (IF Condition)</h4>

<!-- Kode Javascript -->
<script type="text/javascript">
	var password = 12345678;
	var input = 87654321;
	if(input == password)
	{
		console.log('Perintah IF Dijalankan!');
	}else if(input != password)
	{
		console.log('Perintah ELSE IF Dijalankan!');
	}
</script>
</body>
</html>


Penjelasan :

1. Baris 12, password adalah 12345678

2. Baris 13, teman-teman meng-input password menjadi 87654321

3. Baris 14 – 20, kita membuat Alur Percabangan Program

4. Baris 17, kita membuat alur else if dan dijalankan karena Alur else if terpenuhi


Hasil :


4. Switch

Terakhir terdapat alur percabangan program yang bernama switch. Switch adalah alur program yang versi bentuk penyederhanaan dari IF.

<!DOCTYPE html>
<html>
<head>
	<link rel="icon" type="image/x-icon" href="img/pbs2.png">
	<title>Frontend : JAVASCRIPT Bagian 8 - Alur Percabangan Program (IF Condition)</title>
</head>
<body>
<h4>JAVASCRIPT Bagian 8 - Alur Percabangan Program (IF Condition)</h4>

<!-- Kode Javascript -->
<script type="text/javascript">
	var x = 3;
	switch(x){
		case 1:
		console.log('Hasil Switch = 1');
		break;
		case 2:
		console.log('Hasil Switch = 2');
		break;
		case 3:
		console.log('Hasil Switch = 3');
		break;
		default:
		console.log('Hasil Switch = Lebih dari 3');
		break;
	}
</script>
</body>
</html>


Penjelasan :

1. Baris 12, kita membuat variabel x dengan nilai 3

2. Baris 13 – 26, kita membuat alur percabangan program Switch

3. Baris 21, terpenuhi karena nilai case sama dengan nilai variabel x


Hasil :

Leave a Reply

Your email address will not be published. Required fields are marked *