Operator Perbandingan dalam JavaScript

Di dalam JavaScript (dan juga bahasa pemograman lain) operator perbandingan adalah operator yang digunakan untuk membandingkan sebuah nilai atau variabel dengan variabel lainnya. Hasil dari operasi perbandingan ini akan menghasilkan nilai boolean.

Operator perbandingan di dalam JavaScript adalah sebagai berikut:

Operator sama dengan (==)

Operator sama  dengan  adalah operator yang akan membandingkan 2 buah nilai atau variabel dan menghasilkan nilai true jika variabel tersebut bernilai sama. Berikut adalah contoh programnya:

<script>

vara = true; varbenar = true; document.getElementById(‘txtKomentar’).value=(a==benar); // true

vara = 12;

varb = 4;

document.getElementById(‘txtKomentar’).value=(a==b); // false

vara = 7; varb = "7"; document.getElementById(‘txtKomentar’).value=(a==b); // true !

</script>

Perhatikan persamaan pada baris terakhir. Operasi == tidak melihat tipe data dari variabel yang akan dibandingkan, sehingga 7 (tipe data number) akan dianggap sama dengan “7” (tipe data string). Jika anda ingin membandingkan kedua variabel ini, dan memasukkan jenis tipe data sebagai salah satu penilaian sama atau tidaknya 2 buah variabel, maka harus menggunakan operator identikal (===).

Operator identik dengan (===)

Operator identikal === hampir sama dengan operator ==, yaitu membandingkan apakah 2 buah variabel atau hasil operasi program sama atau tidak. Perbedaannya, operator === lebih ‘ketat aturan’ daripada operator ==. Operasi 7 == “7” akan dianggap sama dan menghasilkan nilai true, namun operasi 7 === “7” akan dianggap false, karena tipe data kedua nilai ini berbeda.

<script>

vara = true; varbenar = true; document.getElementById(‘txtKomentar’).value=(a===benar); // true

vara = 12;

varb = 4;

document.getElementById(‘txtKomentar’).value=(a===b); // false

vara = 7;

varb = "7";

document.getElementById(‘txtKomentar’).value=(a===b); // false !

vara = "7"; varb = "7"; document.getElementById(‘txtKomentar’).value=(a===b); // true

</script>

Operator tidak sama dengan (!=)

Operator != adalah kebalikan dari operator ==, dan akan menghasilkan nilai true jika hasil operasi 2 buah variabel yang dibandingkan tidak memiliki nilai yang sama. Berikut adalah contoh penggunannya:

<script>

vara = true;

varbenar = true;

document.getElementById(‘txtKomentar’).value=(a!=benar); // false

vara = 12; varb = 4; document.getElementById(‘txtKomentar’).value=(a!=b); // true

vara = 7;

varb = "7";

document.getElementById(‘txtKomentar’).value=(a!=b); // false !

</script>

Perhatikan juga untuk persamaan baris terakhir, operator != tidak mempertimbangkan tipe data variabel, sama seperti operator ==. Jika anda ingin jenis tipe data juga merupakan kriteria perbandingan, maka gunakan operator !==.

Operator tidak identik dengan (!==)

Jika operator != tidak mempertimbangkan tipe data, maka operator !== hanya akan false jika operator yang dibandingkan memiliki nilai yang sama dan juga tipe data yang sama. Berikut adalah contoh penggunaannya:

<script>

vara = true; varbenar = true; document.getElementById(‘txtKomentar’).value=(a!==benar); // false

vara = 12; varb = 4; document.getElementById(‘txtKomentar’).value=(a!==b); // true

vara = 7; varb = "7"; document.getElementById(‘txtKomentar’).value=(a!==b); // true !

vara = "7"; varb = "7"; document.getElementById(‘txtKomentar’).value=(a!==b); // false

</script>

Operator Kurang dari (<) dan Kurang sama dengan dari: (<=)

Operator < dan <= hanya akan bernilai true jika variabel di sisi kiri operator memiliki nilai yang kurang dari variabel di sisi kanan. Perbedaan antara < dan <= adalah jika kedua nilai yang dibandingkan sama, maka operator < akan menghasilkan false, namun operator <= akan menghasilkan true. Berikut adalah contoh programnya:

<script> vara = 3; varb = 4;

document.getElementById(‘txtKomentar’).value=(a<b); // true

document.getElementById(‘txtKomentar’).value=(a<=b); // true

vara = 5;

varb = 5;

document.getElementById(‘txtKomentar’).value=(a<b); // false

document.getElementById(‘txtKomentar’).value=(a<=b); // true

</script>

Operator Besar dari (>) dan Besar sama dengan dari (>=)

Operator > dan>= hanya akan bernilai true jika variabel di sisi kiri operator memiliki nilai yang lebih besar dari variabel di sisi kanan. Perbedaan antara > dan >= adalah jika kedua nilai yang dibandingkan sama, maka operator > akan menghasilkan false, namun operator

>= akan menghasilkan true. Berikut adalah contoh programnya

<script> vara = 3; varb = 4;

document.getElementById(‘txtKomentar’).value=(a>b); // false

document.getElementById(‘txtKomentar’).value=(a>=b); // false

vara = 5;

varb = 5;

document.getElementById(‘txtKomentar’).value=(a>b); // false

document.getElementById(‘txtKomentar’).value=(a>=b); // true

</script>

Walaupun di dalam contoh yang kita jalankan, operasi perbandingan menggunakan tipe data  angka  (number),  namun  operasi  perbandingan  di  dalam  JavaScript  juga  bisa dilakukan untuk tipe data String. Operasi perbandingan string di dalam JavaScript dilakukan secara bit per bit atau dengan melihat urutan dari kode Unicodenya.

Operasi Logika dalam JavaScript

Selain  operasi  perbandingan,  operasi  logika  juga  sangat  berkaitan  dengan  tipe  data

boolean. Operasi logika ini juga sering digunakan untuk pembuatan alur program. Berikut adalah operator logika dan cara penulisan operator logika di dalam JavaScript:

• Operator “dan” (and), ditulis dengan &&. Operator and hanya akan menghasilkan nilai true jika kedua nilai yang dibandingkan juga bernilai true, dan menghasilkan nilai false jika salah satu atau kedua nilai yang dibandingkan adalah false.

•          Operator “atau” (or), ditulis dengan ||. Operator or akan menghasilkan nilai true jika

salah satu atau kedua nilai yang dibandingkan adalah true. Jika kedua nilai yang dibandingkan false, maka hasilnya adalah false.

• Operator  negasi,  ditulis  dengan  !.  Operator  ini  digunakan  untuk  membalik  nilai logika. Jika ditulis a adalah true maka !a adalah false dan begitu juga sebaliknya.

Berikut adalah contoh kode program penggunaan operator logika di dalam JavaScript:

<script>

vara = true;

varb = false;

varhasil1 = a && b;

document.getElementById(‘txtKomentar’).value=(hasil1); //false

varhasil2 = a && a;

document.getElementById(‘txtKomentar’).value=(hasil2); //true

varhasil3 = a || b;

document.getElementById(‘txtKomentar’).value=(hasil3); //true

varhasil4 = !a;

document.getElementById(‘txtKomentar’).value=(hasil4); //false

</script>

Di  dalam  JavaScript  tidak  dikenal  operator  logika  XOR,  yakni  operator  yang  akan menghasilkan nilai true jika salah satu bernilai true, tetapi akan menghasilkan false jika

kedua nilai true atau kedua nilai false. Namun hal ini bisa ‘diakali’ dengan menggunakan kode seperti berikut ini: !a != !b.

Berikut contoh penggunaannya:

<script>

vara = true;

varb = false;

varxor1 = !a != !b;

document.getElementById(‘txtKomentar’).value=(xor1); // true

varxor2 = !a != !a;

document.getElementById(‘txtKomentar’).value=(xor2); // false

</script>

Struktur IF

Jika anda pernah mempelajari bahasa pemograman lain, pastinya tidak asing dengan struktur IF. Struktur IF adalah stuktur kode pemograman ‘conditional’ yang akan membuat percabangan di dalam program. Dengan menggunakan struktur IF, kita bisa membuat 2 percabangan program yang akan dieksekusi jika ‘kondisi’ terpenuhi, dan akan menjalankan kode program lain jika ‘kondisi’ tidak terpenuhi.

Berikut adalah penulisan dasar alur logika IF:

if (kondisi) {

//kode program jika kondisi true

}

else {

//kode program jika kondisi false

}

Cara Penulisan Struktur Logika IF

Penulisan stuktur IF di dalam JavaScript, mirip dengan bahasa pemograman C++ atau PHP. Berikut adalah contoh penulisan struktur IF di dalam JavaScript:

<script>

var nama="ilkom";     //buat variabel String nama dan isi dengan ”ilkom” if (nama=="ilkom")   // cek apakah variabel nama berisi ”ilkom” document.getElementById(‘txtKomentar’).value=("Berhasil!");

</script>

Kode program diatas tidak akan menjalankan perintah document.getElementById(‘txtKomentar’).value=(“Berhasil!”) jika variabel nama tidak berisi string “ilkom”.

Jika baris yang akan dijalankan terdiri dari 2 baris atau lebih, maka kita harus menggunakan tanda kurung kurawal (tanda { dan })pada awal dan akhir blok kondisi IF, seperti contoh berikut:

<script>

var nama="ilkom";

if (nama=="ilkom")

{

document.getElementById(‘txtKomentar’).value=("Berhasil!"); document.getElementById(‘txtKomentar’).value=("Belajar"); document.getElementById(‘txtKomentar’).value=("JavaScript");

}

</script>

Cara Penulisan Struktur Logika IF ELSE dalam JavaScript

Struktur IF memiliki percabangan lain yang akan dijalankan jika kondisi IF tidak terpenuhi, yakni dengan menambahkan perintah ELSE. Berikut contoh penulisannya:

<script>

//buat variabel Number angka dan isi dengan nilai 17 var angka=17;

// jika sisa hasil bagi (mod) variabel angka dengan 2 adalah 0,

// maka jalankan perintah document.getElementById(‘txtKomentar’).value=()

if (angka%2==0)

document.getElementById(‘txtKomentar’).value=("Angka adalah bilangan

genap");

else

document.getElementById(‘txtKomentar’).value=("Angka adalah bilangan

ganjil");

</script>

Kondisi angka%2==0 hanya akan bernilai TRUE jika nilai dari variabel angka bisa habis dibagi 2, yang menandakan angka adalah bilangan genap, selain itu dapat dipastikan bahwa angka adalah bilangan ganjil.

Sama seperti struktur IF, jika bagian ELSE memiliki baris lebih dari 1, maka kita harus menambahkan tanda kurung kurawal untuk menandai blok tersebut. seperti contoh berikut:

<script>

var angka=12;

if (angka%2==0)

{

document.getElementById(‘txtKomentar’).value=("Angka = "+angka); document.getElementById(‘txtKomentar’).value=("Angka adalah bilangan genap");

}

else

{

document.getElementById(‘txtKomentar’).value=("Angka = "+angka);

document.getElementById(‘txtKomentar’).value=("Angka adalah bilangan ganjil");

}

</script>

Cara Penulisan Nested IF dalam JavaScript

Struktur Nested IF atau IF bersarang adalah cara penggunaan struktur IF secara berulang, yakni stuktur IF yang berada didalam IF. Alur program seperti ini biasa di gunakan untuk logika yang lebih detail. Berikut adalah contoh penggunaannya:

<script>

var angka=-12;

if (angka%2==0)

{

document.getElementById(‘txtKomentar’).value=("Angka = "+angka); document.getElementById(‘txtKomentar’).value=("Angka adalah bilangan genap");

if (angka > 0)

{

document.getElementById(‘txtKomentar’).value=("Angka besar dari 0");

}

else

{

document.getElementById(‘txtKomentar’).value=("Angka kecil dari 0");

}

}

else

{

document.getElementById(‘txtKomentar’).value=("Angka = "+angka); document.getElementById(‘txtKomentar’).value=("Angka adalah bilangan ganjil");

if (angka > 0)

{

document.getElementById(‘txtKomentar’).value=("Angka besar dari 0");

}

else

{

document.getElementById(‘txtKomentar’).value=("Angka kecil dari 0");

}

}

</script>

Dalam contoh diatas, saya membuat program yang akan menyeleksi apakah variabel angka

berisi 4 kemungkinan, yakni apakah angka merupakan bilangan genap dan positif, bilangan

genap dan negatif, bilangan ganjil dan positif, atau bilangan ganjil dan negatif. Karena ada 4 kondisi akhir yang mungkin terjadi, maka saya menggunakan nested IF.

Dalam pembuatan kode program yang menggunakan konsep nested IF ini, kita harus selalu memperhatikan tanda kurung kurawal yang menandakan awal dan akhir blok program. Lupa dalam menutup suatu blok IF akan menyebabkan program tersebut tidak akan berjalan (akan menghasilkan error), atau yang lebih sukar di deteksi adalah program akan menghasilkan kesalahan logika. Editor pemograman yang khusus seperti Notepad++ akan memudahkan kita untuk memastikan bahwa suatu blok program telah ditutup secara benar.

Cara Penulisan Struktur Logika ELSE IF dalam JavaScript

Struktur ELSE IF adalah bentuk lain dari penulisan struktur IF ELSE. Struktur ELSE IF terbentuk ketika kita menggunakan struktur IF ELSE secara berulang. Berikut contoh sederhananya:

<script>

var angka=2;

if (angka==1)

{

document.getElementById(‘txtKomentar’).value=("Angka Satu");

}

else if (angka==2)

{

document.getElementById(‘txtKomentar’).value=("Angka Dua");

}

else if (angka==3)

{

document.getElementById(‘txtKomentar’).value=("Angka Tiga");

}

else if (angka==4)

{

document.getElementById(‘txtKomentar’).value=("Angka Empat");

}

</script>

Pengertian Struktur Logika SWITCH dalam JavaScript

Struktur  logika  SWITCH  dapat  disederhanakan  sebagai  bentuk  khusus  dari  struktur  IF ELSE. SWITCH digunakan untuk percabangan kode program dimana kondisi yang diperiksa hanya 1 namun membutuhkan banyak opsi.

Struktur dasar penulisan SWITCH adalah sebagai berikut:

switch (kondisi)

{

case hasil_kondisi_1:

// kode program jika kondisi sama dengan hasil_kondisi_1 break;

case hasil_kondisi_2:

// kode program jika kondisi sama dengan hasil_kondisi_2 break;

default:

kode program untuk kondisi lainnya break;

}

Kondisi untuk inputan struktur SWITCH biasanya adalah variabel yang akan diperiksa. Hasil percabangan dari variabel tersebut akan ditangani oleh perintah case. Opsi default bisa ditambahkan untuk menangani kasus yang tidak ditangani oleh perintah case.

Cara Penulisan Struktur Logika SWITCH dalam JavaScript

Agar lebih mudah dipahami, langsung saja kita masuk ke dalam kode program SWITCH dalam JavaScript. Contoh program berikut mengambil contoh terakhir dalam tutorial percabangan ELSE IF sebelumnya, yakni kita memeriksa nilai dari variabel angka dan menampilkan hasilnya dalam bentuk huruf. Jika menggunakan struktur SWITCH, berikut adalah cara penulisannya:

<script>

var angka=5;

switch (angka)

{

case 1:

document.getElementById(‘txtKomentar’).value=("Angka Satu");

break;

case 2:

document.getElementById(‘txtKomentar’).value=("Angka Dua");

break;

case 3:

document.getElementById(‘txtKomentar’).value=("Angka Tiga");

break;

case 4:

document.getElementById(‘txtKomentar’).value=("Angka Empat");

break;

default:

document.getElementById(‘txtKomentar’).value=("Bukan angka 1 - 4");

break;

}

</script>

Setelah mendeklarasikan variabel a dan mengisi nilainya dengan angka 5, kemudian kita masuk ke struktur SWITCH.

Blok SWITCH diawali dan diakhiri dengan kurung kurawal. Dan kemudian untuk setiap kemungkinan yang terjadi dari variabel angka, ditampung dengan perintah case.

Perintah case diikuti dengan kondisi yang ingin di-’tampung’. Di dalam contoh diatas, saya menampung isi variabel angka dengan case 1 untuk menangani kondisi jika angka==1, case 2 untuk menangani kondisi jika angka==2, dan seterusnya. Setiap case lalu diikuti dengan tanda titik dua (:).

Pada kondisi terakhir, terdapat perintah default yang tujuannya adalah untuk menampung kondisi jika seluruh kondisi case tidak tersedia. Contohnya, jika variabel angka berisi angka

0, maka kondisi case yang ada tidak tersedia untuk menangani hal ini, dan perintah default

lah yang akan dijalankan.

Jika anda perhatikan dalam setiap  case, saya menambahkan perintah  break. Perintah break disini bertujuan untuk mengistruksikan kepada JavaScript untuk segera keluar dari SWITCH jika salah satu case ditemukan. Jika kita tidak mencantumkan perintah break, maka seluruh perintah mulai dari case yang sesuai sampai ke bawah akan dijalankan. Berikut contohnya:

<script>

var angka=3;

var hasil=””;

switch (angka)

{

case 1:

hasil=hasil+("Angka Satu \n");

case 2:

hasil=hasil+("Angka Dua \n");

case 3:

hasil=hasil+("Angka Tiga \n");

case 4:

hasil=hasil+("Angka Empat \n");

default:

hasil=hasil+("Bukan angka 1 - 4");

}

document.getElementById('txtKomentar').value=hasil;

</script>

Jika anda menjalankan kode JavaScript tersebut, maka yang akan dihasilkan adalah:

Angka Tiga Angka Empat Bukan angka 1 – 4

Untuk penjelasan lebih lengkap bisa dibaca pada Buku Ajar Pemrogram Web