Video học lập trình mỗi ngày

Toán tử trong javascript chủ yếu được sử dụng để thực hiện các hoạt động trong ứng dụng. Có rất nhiều javascript operators như toán tử số học, gán, chuỗi ... Thế nhưng 3 toán tử này được giới thiệu dưới đây làm cho mỗi anh em chúng ta khi sử dụng có thể có sự nhầm lẫn ở đây. Đó là 3 toán tử: 

Nullish Coalescing Operator (??) 

Logical Nullish Assignment (??=) 

Optional Chaining Operator (?.) 

JavaScript operators

Gần đây có một bài viết "JavaScript Amazing operators" có đề cập đến các cách sử dụng 3 toán tử trên. Bài viết này được viết trên hashnode một trong những cộng đồng cũng mạnh về lập trình. Anh em có thể đăng ký và đọc miễn phí. Tác giả giải thích rất rõ ràng, và tôi không có ý định thêm bớt một chút nào nữa!! Nếu thêm thì tôi sẽ link về những bài viết mà tipjs đã giải thích kỹ càng trước đó rồi, còn đây là một trong những cách so sánh hay hơn mà thôi.

Nullish Coalescing Operator (??) 

Cú pháp: a??b 

Giải thích: 

Nếu a được định nghĩa thì kết quả sẽ là a 

Nếu a là Nullish ( NULL or UNDEFINED ) thì kết quả sẽ là b 

Xem ví dụ:

let a = NULL
console.log(a??50) //50
console.log(a) //NULL
let a=10
let c=30
console.log(a??b??c??d) //10
//Trả về kết quả đầu tiên nếu a được xác định

Ở đây các lập trình viên nên chú ý đến cụm từ Nullish. Nullish chính là NULL or UNDEFINED. Và cần phải hiểu rõ về sự khác biệt giữa null và undefined

Logical Nullish Assignment (??=)

Cú pháp: a ??= b Tương đương với a ?? (a=b) 

Giải thích: 

Nếu a không phải là NULLISH ( NULL or UNDEFINED ) thì kết quả sẽ là a. 

Nếu a là NULLISH thì kết quả sẻ là b, nhưng b sẽ có nhiệm vụ gán giá trị cho a. Hay gọi là assigned đấy. 

Xem ví dụ:

let a = NULL
console.log(a??=50) //50
console.log(a) //50

Dừng lại và xem kết quả này so với kết quả của ví dụ về (??). Xem có gì khác không nhé! a lúc này không phải là NULL như trước nữa. Đúng không? 

Optional Chaining Operator (?.)

Cú pháp: obj ?. prop 

Giải thích 

Những ai sử dụng obj.prop() thì biết là kiểm tra một thuộc tính có tộn tại hay không? Ở đây khi sử dụng (?.) cũng được kết qủa tương tự như vậy, nhưng chỉ có khác một chút, nếu mà giá trị NULL or UNDEFINED thì luôn return về UNDEFINED. 

Ví dụ:

const adventurer = {
  name: 'Alice',
  cat: {
    name: 'Dinah'
  }
};

const dogName = adventurer.dog?.name;
console.log(dogName);
// expected output: undefined

console.log(adventurer.someNonExistentMethod?.());
// expected output: undefined

Bài viết này là quá rõ cho việc sử dụng 3 toán tử trên, nhưng bạn nên đọc thêm link ở dưới đây để có được cách nhìn và hiểu tổng thể hơn. 

Ref: https://capscode.hashnode.dev/javascript-amazing-operators