Tutorial Belajar JavaScript Bagian 20 : Operator Perbandingan di JavaScript

Pada tutorial sebelumnya,kita sudah mempelajari tentang Tutorial Belajar JavaScript Bagian 19 : Operator Unary, Increment & Decrement di JavaScript. Dalam tutorial ini, Anda akan mempelajari cara menggunakan operator perbandingan JavaScript untuk membandingkan dua nilai.

Pengantar operator perbandingan JavaScript

Untuk membandingkan 2 nilai, Anda menggunakan operator perbandingan. Tabel berikut menunjukkan operator perbandingan dalam JavaScript :

OperatorArti
<Lebih besar
>Lebih kecil
<=Lebih kecil atau sama dengan
>=Lebih besar atau sama dengan
==Sama dengan
!=Tidak sama dengan

Operator perbandingan mengembalikan nilai Boolean yang menunjukkan bahwa perbandingan itu true atau false. Lihat contoh berikut :

let r1 = 20 > 10; // true
let r2 = 20 < 10; // false
let r3 = 10 == 10; // true

Operator pembanding mengambil 2 nilai. Jika jenis nilai tidak dapat dibandingkan, operator pembanding mengubahnya menjadi nilai dengan jenis yang sebanding menurut aturan tertentu.

Bandingkan angka

Jika nilai adalah angka, operator pembanding melakukan perbandingan numerik. Sebagai contoh :

let a = 10,
     b = 20;

console.log(a >= b); // false

console.log(a == 10); // true

Contoh ini mudah. Variabel a adalah 10, b adalah 20. Ekspresi a >= b mengembalikan nilai false dan ekspresi a == 10 mengembalikan nilai true.

Bandingkan string

Jika nilai adalah string, JavaScript membandingkan kode karakter secara numerik satu per satu dalam string.

let nama1 = 'alice',
     nama2 = 'bob';
let hasil = nama1 < nama2;

console.log(hasil); // true

console.log(nama1 == 'alice'); // true

Karena JavaScript membandingkan kode karakter dalam string secara numerik, Anda mungkin menerima hasil yang tidak terduga, misalnya :

let f1 = 'Apel',
     f2 = 'Pisang';
let hasil = f2 < f1;

console.log(hasil); // true

Dalam contoh ini, f2 lebih kecil dari f1 karena huruf B memiliki kode karakter 66 sedangkan huruf a memiliki kode karakter 97.

Untuk memperbaikinya, Anda perlu:

  • Pertama, ubah string menjadi format umum, huruf kecil atau huruf besar
  • Kedua, bandingkan nilai yang dikonversi

Sebagai contoh:

let f1 = 'Apel',
     f2 = 'Pisang';
let hasil = f2.toLowerCase() < f1.toLowerCase();

console.log(hasil); // false

Perhatikan bahwa toLowerCase() adalah metode objek String yang mengubah string menjadi huruf kecil.

Bandingkan angka dengan nilai tipe lain

Jika suatu nilai adalah angka dan yang lainnya bukan, operator pembanding akan mengonversi nilai non-numerik menjadi angka dan membandingkannya secara numerik. Sebagai contoh :

console.log(10 < '20'); // true

Dalam contoh ini, operator pembanding mengubah string ’20’ menjadi angka 20 dan membandingkannya dengan angka 10. Berikut contohnya :

console.log(10 == '10'); // true

Dalam contoh ini, operator pembanding mengonversi string ’10’ menjadi angka 10 dan membandingkannya secara numerik.

Bandingkan objek dengan non-objek

Jika sebuah nilai adalah objek, metode valueOf() dari objek tersebut dipanggil untuk mengembalikan nilai untuk perbandingan. Jika objek tidak memiliki metode valueOf(), metode toString() akan dipanggil sebagai gantinya. Sebagai contoh :

let apel = {
   nilaiDari: function () {
     return 10;
   },
};
let jeruk = {
   toString: function () {
     return '20';
   },
};

console.log(apel > 10); // false

console.log(jeruk == 20); // true

Pada perbandingan pertama ini, objek apel memiliki metode valueOf() yang mengembalikan nilai 10. Oleh karena itu, operator perbandingan menggunakan angka 10 untuk perbandingan.

Dalam perbandingan kedua, JavaScript pertama-tama memanggil metode valueOf(). Namun, objek jeruk tidak memiliki metode valueOf(). Jadi JavaScript memanggil metode toString() untuk mendapatkan nilai kembali 20 untuk perbandingan.

Bandingkan Boolean dengan nilai lain

Jika suatu nilai adalah nilai Boolean, JavaScript mengubahnya menjadi angka dan membandingkan nilai yang dikonversi dengan nilai lainnya; true diubah menjadi 1 dan false diubah menjadi 0. Contoh :

console.log(true > 0); // true
console.log(false < 1); // true
console.log(true > false); // true
console.log(false > true); // false
console.log(true >= true); // true
console.log(true <= true); // true
console.log(false <= false); // true
console.log(false >= false); // true

Selain aturan di atas, operator equal (==) dan not-equal(!=) juga memiliki aturan berikut.

Bandingkan nol dan tidak terdefinisi

Dalam JavaScript, null sama dengan tidak terdefinisi. Ini berarti bahwa ekspresi berikut mengembalikan nilai true.

console.log(null == undefined); // true

Bandingkan NaN dengan nilai lainnya

Jika false satu nilai adalah NaN, maka operator(==) yang sama mengembalikan nilai false.

console.log(NaN == 1); // false

Lihat juga contoh berikut.

console.log(NaN == NaN); // false

Operator not-equal (!=) mengembalikan nilai true saat membandingkan NaN dengan nilai lain :

console.log(NaN != 1); // true

Dan juga

console.log(NaN != NaN); // true

Identik dengan (===) dan tidak identik dengan (!==)

Selain operator pembanding di atas, JavaScript menyediakan operator sama persis ( ===) dan tidak sama persis ( !==).

OperatorArti
===Identik dengan
!==Tidak identik dengan

Operator sama persis dan tidak sama persis berperilaku seperti operator sama dan tidak sama kecuali bahwa mereka tidak mengonversi sebelum perbandingan. Lihat contoh berikut :

console.log("10" == 10); // true
console.log("10" === 10); // false

Pada perbandingan pertama, karena kita menggunakan operator kesetaraan, JavaScript mengubah string menjadi angka dan melakukan perbandingan.

Namun, pada perbandingan kedua, kita menggunakan operator yang identic dengan ( ===), JavaScript tidak mengonversi string sebelum perbandingan, oleh karena itu hasilnya false.

Dalam tutorial ini, Anda telah mempelajari cara menggunakan operator perbandingan JavaScript untuk membandingkan nilai.

Artikel Lainnya

0 Komentar

Kirim Komentar

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Situs ini menggunakan Akismet untuk mengurangi spam. Pelajari bagaimana data komentar Anda diproses.

0