[Tự học Javascript] Toán tử kết hợp Nullish ‘??’ trong Javascript

Toán tử hợp nhất nullish ??cung cấp một cú pháp ngắn để chọn một biến đầu tiên được định nghĩa(có giá trị) từ danh sách.

Kết quả a ?? blà:

• Chọn anếu nó không nullhoặc undefined
• Chọn b cho trường hợp ngược lại ở trên

Vì vậy, x = a ?? b sẽ tương đương với:

x = (a !== null && a !== undefined) ? a : b;

Đây là một ví dụ dài hơn.

Hãy nói rằng, chúng ta có một firstName, lastNamehoặc nickName, tất cả trong số đó đều là tùy chọn.

Chúng ta hãy chọn một định nghĩa và hiển thị nó:

/*
Cafedev.vn - Kênh thông tin IT hàng đầu Việt Nam
@author cafedevn
Contact: cafedevn@gmail.com
Fanpage: https://www.facebook.com/cafedevn
Instagram: https://instagram.com/cafedevn
Twitter: https://twitter.com/CafedeVn
Linkedin: https://www.linkedin.com/in/cafe-dev-407054199/
*/

let firstName = null;
let lastName = null;
let nickName = "Supercoder";

// show the first not-null/undefined variable
alert(firstName ?? lastName ?? nickName ?? "Anonymous"); // Supercoder

1. So sánh với ||

Điều đó rất giống với toán tử || OR . Trên thực tế, chúng ta có thể thay thế ??bằng || như ở trên và nhận được kết quả tương tự.

Sự khác biệt quan trọng là:

• ||trả về giá trị đúng đầu tiên .
• ??trả về giá trị được xác định(có giá trị) đầu tiên .

Điều này rất quan trọng khi chúng ta muốn xử lý null/undefinedkhác biệt với0.

Ví dụ:

height = height ?? 100;

Điều này đặt heightthành 100nếu nó không được xác định. Nhưng nếu heightcó 0, thì nó vẫn là 0.

Hãy so sánh nó với ||:

let height = 0;

alert(height || 100); // 100
alert(height ?? 100); // 0

Lợi củaheight ?? 100 là nhận 100chỉ khi heightbằng nullhoặc undefined.

2. Quyền ưu tiên

Mức độ ưu tiên của toán tử ?? khá thấp là7trong bảng MDN.

Nó thấp hơn so với hầu hết các toán từ và cao hơn một chút so với =và ?.

Vì vậy, nếu chúng ta cần sử dụng ??trong một biểu thức phức tạp, thì hãy xem xét thêm dấu ngoặc đơn:

let height = null;
let width = null;

// important: use parentheses
let area = (height ?? 100) * (width ?? 50);

alert(area); // 5000

Mặt khác, nếu chúng ta bỏ qua dấu ngoặc đơn, thì *có quyền ưu tiên cao hơn và sẽ chạy trước. Điều đó sẽ giống như:

// not correct
let area = height ?? (100 * width) ?? 50;

Ngoài ra còn có một giới hạn cấp độ ngôn ngữ ở đây. Vì lý do an toàn, nó bị cấm sử dụng các toán tử ??cùng với &&và các ||.

Code dưới đây gây ra lỗi cú pháp:

let x = 1 && 2 ?? 3; // Syntax error

Giới hạn chắc chắn là gây tranh cãi, nhưng vì một số lý do, nó đã được thêm vào đặc tả ngôn ngữ.

Sử dụng dấu ngoặc đơn rõ ràng để sửa nó:

let x = (1 && 2) ?? 3; // Works
alert(x); // 2

3. Tóm lược

• Toán tử kết hợp nullish ??cung cấp một cách ngắn gọn để chọn một giá trị xác định rõ ràng của danh sách từ danh sách. Nó được sử dụng để gán giá trị mặc định cho các biến:

// set height=100, if height is null or undefined height = height ?? 100;

Toán tử ??có độ ưu tiên rất thấp, cao hơn một chút so với ?và =.

Không được phép sử dụng nó có ||hoặc &&không có dấu ngoặc đơn rõ ràng.