Operator Penggabungan Nullish pada JavaScript

Pada tutorial ini, Anda akan mempelajari tentang operator penggabungan nullish pada JavaScript (??) yang menerima dua nilai dan mengembalikan nilai kedua jika yang pertama adalah null atau undefined.

Pengantar Operator Penggabungan Nullish pada JavaScript

Pada tahun 2020, diperkenalkan operator penggabungan nullish yang ditandai dengan dua tanda tanya (??). Operator penggabungan nullish adalah operator logika yang menerima dua nilai:

nilai1 ?? nilai2

Operator penggabungan nullish mengembalikan nilai kedua (nilai2) jika nilai pertama (nilai1) adalah null atau undefined. Secara teknis, operator penggabungan nullish setara dengan blok berikut:

let hasil = nilai1;
if (hasil === null || hasil === undefined) {
   hasil = nilai2;
}

Sebuah nilai nullish adalah nilai yang entah null atau undefined.

Contoh berikut menggunakan operator penggabungan nullish (??) untuk mengembalikan string ‘John’ karena nilai pertama adalah null:

const nama = null ?? 'John';
console.log(nama); // 'John'

Dan contoh ini mengembalikan nilai 28 karena nilai pertama adalah undefined:

const usia = undefined ?? 28;
console.log(usia);

Mengapa Menggunakan Operator Penggabungan Nullish

Ketika memberikan nilai default ke variabel, seringkali Anda menggunakan operator logika OR (||). Misalnya:

let hitung;
let hasil = hitung || 1;
console.log(hasil); // 1

Pada contoh ini, variabel hitung adalah undefined, dan diubah menjadi false. Oleh karena itu, hasilnya adalah 1.

Namun, operator logika OR (||) terkadang membingungkan jika Anda mempertimbangkan 0 atau string kosong ” sebagai nilai yang valid seperti ini:

let hitung = 0;
let hasil = hitung || 1;

Hasilnya adalah 1, bukan 0, yang mungkin tidak Anda harapkan.

Operator penggabungan nullish membantu Anda menghindari jebakan ini. Ini hanya mengembalikan nilai kedua ketika yang pertama adalah null atau undefined.

Operator penggabungan nullish dihentikan secara singkat

Sama seperti operator logika OR dan AND, operator penggabungan nullish tidak mengevaluasi nilai kedua jika operan pertama tidak undefined atau null.

Contoh:

let hasil = 1 ?? console.log('Hi');

Pada contoh ini, operator ?? tidak mengevaluasi ekspresi kedua yang menampilkan “Hi” ke konsol karena nilai pertama adalah 1, yang bukan null atau undefined.

Contoh berikut mengevaluasi ekspresi kedua karena yang pertama adalah undefined:

let hasil = undefined ?? console.log('Hi');

Output:

Hi

Berantai dengan Operator AND atau OR

Akan terjadi SyntaxError jika Anda menggabungkan langsung operator logika AND atau OR dengan operator penggabungan nullish seperti ini:

const hasil = null || undefined ?? 'OK'; // SyntaxError

Namun, Anda dapat menghindari kesalahan ini dengan melibatkan ekspresi di sebelah kiri operator ?? dalam tanda kurung untuk secara eksplisit menentukan urutan operator:

const hasil = (null || undefined) ?? 'OK';
console.log(hasil); // 'OK'

Ringkasan

• Operator penggabungan nullish (??) adalah operator logika yang menerima dua nilai dan mengembalikan nilai kedua jika yang pertama adalah null atau undefined.
• Operator penggabungan nullish dihentikan secara singkat dan tidak dapat langsung digabungkan dengan operator logika AND atau OR.