Hướng dẫn does javascript have elvis operator? - javascript có toán tử elvis không?

Toán tử Elvis là phiên bản ngắn hơn của toán tử ternary. Nhà điều hành này được gọi là toán tử hợp tác

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Nó chỉ trả về một giá trị mặc định khi giá trị biểu thức là

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Thực hiện

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

6 Nhà điều hành hợp tác

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

7 trong JavaScript

Nhà điều hành hợp tác

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Syntax:

leftExpr ?? rightExpr

Toán tử

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val_1 = undefined || 'Hello!';
let val_2 = false || 'Hello!';
let val_3 = "" || 'Hello!';

console.log[val_1, val_2, val_3];

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val_1 = undefined || 'Hello!';
let val_2 = false || 'Hello!';
let val_3 = "" || 'Hello!';

console.log[val_1, val_2, val_3];

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Code:

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Ở đây, chúng tôi đã tạo một đối tượng gọi là

Hello! Hello! Hello!

Hello! Hello! Hello!

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Ở bên trái của toán tử

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Hello! Hello! Hello!

Hello! Hello! Hello!

Hello! Hello! Hello!

Hello! Hello! Hello!

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Biểu thức

Hello! Hello! Hello!

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Hello! Hello! Hello!

Hello! Hello! Hello!

Hello! Hello! Hello!

Output:

Toán tử kết hợp

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Code:

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Trong ví dụ này, nếu cả

let val_1 = undefined ?? 'Hello!';
let val_2 = false ?? 'Hello!';
let val_3 = "" ?? 'Hello!';

console.log[val_1, val_2, val_3];

Hello! false

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Vì vậy, ở đây, chỉ có biểu thức

Hello! false

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Hello! Hello! Hello!

Hello! Hello! Hello!

Hello! Hello! Hello!

Biến

Hello! Hello! Hello!

Hello! Hello! Hello!

Output:

Nhà điều hành

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Trước khi toán tử

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

Code:

let val_1 = undefined || 'Hello!';
let val_2 = false || 'Hello!';
let val_3 = "" || 'Hello!';

console.log[val_1, val_2, val_3];

Output:

Hello! Hello! Hello!

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

const nestedProp = obj.first && obj.first.second;

Thay đổi ví dụ tương tự bằng cách thay thế toán tử

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Code:

let val_1 = undefined ?? 'Hello!';
let val_2 = false ?? 'Hello!';
let val_3 = "" ?? 'Hello!';

console.log[val_1, val_2, val_3];

Output:

Hello! false

Như bạn có thể thấy, toán tử này tạo ra đầu ra thích hợp. Đây là lý do tại sao nhà điều hành liên kết

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Bài viết liên quan - Nhà điều hành JavaScript

Toán tử chuỗi tùy chọn [

const nestedProp = obj.first && obj.first.second;

6] truy cập vào thuộc tính của một đối tượng hoặc gọi hàm. Nếu đối tượng là

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

9 hoặc

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

8, nó sẽ trả về

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

9 thay vì ném lỗi.

Thử nó

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

Cú pháp

Sự mô tả

Điều này dẫn đến các biểu thức ngắn hơn và đơn giản hơn khi truy cập các thuộc tính chuỗi khi khả năng tồn tại là một tham chiếu có thể bị thiếu. Nó cũng có thể hữu ích trong khi khám phá nội dung của một đối tượng khi không có sự đảm bảo nào về việc yêu cầu thuộc tính nào.

Ví dụ, hãy xem xét một đối tượng

const nestedProp = obj.first?.second;

const nestedProp = obj.first && obj.first.second;

Giá trị của

const nestedProp = obj.first?.second;

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

const nestedProp = obj.first?.second;

Đây là một mô hình thành ngữ trong JavaScript, nhưng nó được dài dòng khi chuỗi dài và nó không an toàn. Ví dụ: nếu

const nestedProp = obj.first?.second;

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

obj.val?.prop
obj.val?.[expr]
obj.func?.[args]

Tuy nhiên, với toán tử chuỗi tùy chọn [

const nestedProp = obj.first && obj.first.second;

const nestedProp = obj.first?.second;

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

const nestedProp = obj.first?.second;

Bằng cách sử dụng toán tử

const nestedProp = obj.first && obj.first.second;

const nestedProp = obj.first?.second;

const nestedProp = obj.first?.second;

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

const nestedProp = obj.first?.second;

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Điều này tương đương với các điều sau đây, ngoại trừ biến tạm thời trên thực tế không được tạo ra:

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Chuỗi tùy chọn không thể được sử dụng trên một đối tượng gốc không được khai báo, nhưng có thể được sử dụng với một đối tượng gốc có giá trị

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Chuỗi tùy chọn với các cuộc gọi chức năng

Bạn có thể sử dụng chuỗi tùy chọn khi cố gắng gọi một phương thức có thể không tồn tại. Điều này có thể hữu ích, ví dụ, khi sử dụng API trong đó phương thức có thể không khả dụng, do tuổi thực hiện hoặc do tính năng không có sẵn trên thiết bị của người dùng.

Sử dụng chuỗi tùy chọn với các cuộc gọi chức năng khiến biểu thức tự động trả về

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Tuy nhiên, nếu có một thuộc tính có tên như vậy không phải là một hàm, sử dụng

const nestedProp = obj.first && obj.first.second;

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Lưu ý: Nếu bản thân

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

const nestedProp = obj.first && obj.first.second;

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

const nestedProp = obj.first && obj.first.second;

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Chuỗi tùy chọn với biểu thức

Bạn cũng có thể sử dụng toán tử chuỗi tùy chọn với ký hiệu khung, cho phép chuyển biểu thức làm tên thuộc tính:

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Điều này đặc biệt hữu ích cho các mảng, vì các chỉ số mảng phải được truy cập bằng dấu ngoặc.

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Chuỗi tùy chọn không hợp lệ ở phía bên trái của một nhiệm vụ

Không hợp lệ khi cố gắng gán cho kết quả của một biểu thức chuỗi tùy chọn:

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Short-circuiting

Khi sử dụng chuỗi tùy chọn với các biểu thức, nếu toán hạng bên trái là

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Truy cập tài sản tiếp theo cũng sẽ không được đánh giá.

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Điều này tương đương với:

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Tuy nhiên, hành vi ngắn mạch này chỉ xảy ra dọc theo một "chuỗi" truy cập tài sản liên tục. Nếu bạn nhóm một phần của chuỗi, thì quyền truy cập thuộc tính tiếp theo vẫn sẽ được đánh giá.

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

Điều này tương đương với:

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Tuy nhiên, hành vi ngắn mạch này chỉ xảy ra dọc theo một "chuỗi" truy cập tài sản liên tục. Nếu bạn nhóm một phần của chuỗi, thì quyền truy cập thuộc tính tiếp theo vẫn sẽ được đánh giá.

Ngoại trừ biến

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

39 không được tạo.

Ví dụ

Ví dụ cơ bản

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Ví dụ này tìm kiếm giá trị của thuộc tính

Hello! Hello! Hello!

2 cho thành viên

let myObj = {
    name: {
        firstname: "Adam",
        lastname: "Smith"
    }
};
let val = myObj.name ?? "Default Value";
console.log[val];

41 trong bản đồ khi không có thành viên như vậy. Do đó, kết quả là

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

9.

Xử lý các cuộc gọi lại tùy chọn hoặc trình xử lý sự kiện

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Nếu bạn sử dụng các cuộc gọi lại hoặc tìm nạp các phương thức từ một đối tượng có gán phá hủy, bạn có thể có các giá trị không tồn tại mà bạn không thể gọi là chức năng trừ khi bạn đã kiểm tra sự tồn tại của chúng. Sử dụng

const nestedProp = obj.first && obj.first.second;

6, bạn có thể tránh được bài kiểm tra bổ sung này:

Xếp chồng toán tử chuỗi tùy chọn

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Với các cấu trúc lồng nhau, có thể sử dụng chuỗi tùy chọn nhiều lần:

Kết hợp với nhà điều hành liên kết không

let val = myObj.name ?? myObj.email ?? "something null or undefined";
console.log[val]

Xem thêm