Thứ tự ưu tiên toán tử so sánh javascrip năm 2024

Hôm nay tôi xin giới thiệu với các bạn một chuyên mục mới, chuyên mục này được gọi là Chuyện xưa cũ, đây sẽ là nơi tôi chia sẻ với các bạn những câu chuyện mà có thể các bạn đã từng biết, và đã từng quên, nói chung đây sẽ là những thứ xưa như trái đất, cứ ngỡ ai cũng biết nhưng thực tế chẳng phải vậy. Đâu đó sẽ giống với chuyên mục Java những điều có thể bạn đã biết trước đây, nhưng lần này những câu chuyện tôi kể sẽ rộng hơn, không chỉ đơn giản là về kỹ thuật nữa. Hy vọng các bạn sẽ thích thú với chủ đề này.

Nào cùng bắt đầu với câu chuyện đầu tiên.

Bạn đã biết sự khác biệt của hai toán tử so sánh bằng === và == trong Javascript. Bạn thấy cả hai đều được sử dụng nhưng bạn không chắc về việc bản thân nên sử dụng cái nào. Bạn muốn tìm ra một lý do để thuyết phục bản thân. Vâng bài viết này là dành cho bạn.

So sánh bằng và cùng loại với ===

x === y

Toán tử === chỉ trả về true nếu như cả hai toán hạng đều cùng một loại và có cùng giá trị. Nếu so sánh khác loại, kết quả sẽ trả về false.

Với định nghĩa như thế, hầu hết các trường hợp sẽ được giải quyết, chẳng hạn như chuỗi "0" và 0 khi so sánh kết quả sẽ là false.

Cá nhân tôi khuyên các bạn hãy nên sử dụng === khi lập trình với Javascript, và hãy bỏ qua hoàn toàn toán tử ==.

Cái quái gì diễn ra khi sử dụng ==?

`==`3

Toán tử == sẽ cố gắng chuyển đổi kiểu của toán hạng nếu như hai toán hạng có kiểu khác nhau, và chỉ bắt đầu so sánh sự bằng nhau khi đã thực hiện đổi kiểu xong. Nếu kiểu khác nhau, một trong hai, hoặc cả hai toán hạng sẽ được chuyển về một kiểu chung, hay còn gọi là kiểu trung gian. Sự chuyển đổi này thì thật sự rất là phức tạp, để có một cái nhìn chi tiết hơn các bạn có thể xem chi tiết trên hay .

Và vì lý do trên, khi bạn so sánh chuỗi "0" và số 0, thì toán hạng đầu tiên sẽ được chuyển đổi thành kiểu số, và thực hiện so sánh, kết quả sẽ trả về true.

==`8 ==`9

So sánh chuỗi và số thì còn có thể dễ hiểu, nhưng còn có những quy định phức tạp khác dẫn đến những kết quả cực kì vô lý, làm cho nhiều ngưỡi dễ phát khùng khi sử dụng Javascript như thanh niên Tôi đi code dạo đã từng. Ví dụ như khi so sánh ===`0, ===1 và `false.

===`3 ===4 ===`5

Giờ thì bạn đã biết, chỉ sử dụng === thôi nhé!

Tóm lại, khi so sánh bằng trong Javascript hãy sử dụng toán tử ===. Với toán tử này, khi bạn so sánh khác loại, kết quả sẽ luôn trả về false. Bạn sẽ nhận được kết quả đúng như mong đợi, mà không phải vắt óc suy nghĩ tại sao, hay cố gắng nhớ hết những quy tắc chuyển đổi.

Lưu ý rằng, toán tử so sánh là để dùng với những kiểu dữ liệu nguyên bản (primitive type). Để so sánh bằng giữa các đối tượng (object) hay mảng (array) thì chúng ta phải sử dụng cách tiếp cận khác.

Hy vọng qua bài viết ngắn gọn này các bạn đã tìm được chân lý của đời mình về việc sử dụng == hay ===. Mọi ý kiến đóng góp, đừng ngại mà hãy kéo xuống khung comment bên dưới nhé. Hẹn gặp lại các bạn trong các bài viết tiếp theo.

JavaScript có bốn toán tử logic là: OR

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

3, AND

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

4, NOT

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

5 và "Nullish Coalescing"

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

6. Trong đó, ba toán tử OR, AND và NOT là ba toán tử logic cơ bản mà hầu như ngôn ngữ lập trình nào cũng có.

Vì vậy, bài viết này sẽ tập trung vào tìm hiểu về ba toán tử OR, AND và NOT. Còn toán tử "Nullish Coalescing" sẽ được giới thiệu ở bài viết sau.

Toán tử logic là toán tử kết nối hai hay nhiều biểu thức, dùng để kiểm tra mối quan hệ logic giữa các biểu thức. Kết quả cuối cùng phụ thuộc vào giá trị của từng biểu thức và loại toán tử logic.

Theo định nghĩa thông thường, toán tử logic chỉ áp dụng cho kiểu dữ liệu boolean và kết quả trả về cũng là giá trị boolean.

Nhưng với JavaScript thì khác, toán tử logic áp dụng cho bất kỳ kiểu dữ liệu nào và kết quả trả về cũng là bất kỳ kiểu dữ liệu nào. Để làm được điều này, các toán hạng tham gia đều được chuyển về kiểu dữ liệu boolean để kiểm tra tính logic.

Trước khi tìm hiểu kỹ hơn về các toán tử logic, bạn cần biết hai khái niệm: truthy và falsy.

Truthy và falsy trong JavaScript là gì?

Như bạn đã biết thì kiểu dữ liệu boolean chỉ có hai giá trị là:

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 và

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8. Vì vậy, khi một giá trị được chuyển về kiểu dữ liệu boolean, kết quả sẽ là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 hoặc

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8.

Những giá trị mà khi chuyển về kiểu dữ liệu boolean ra giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 gọi là truthy.

Tương tự, những giá trị mà khi chuyển về kiểu dữ liệu boolean ra giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8 gọi là falsy.

Để chuyển một giá trị về kiểu dữ liệu boolean, bạn có thể dùng hàm

console.log(true || true || true); // true console.log(true || false || true); // true console.log(false || true || false); // true console.log(false || false || false); // false

3.

Ví dụ các giá trị truthy:

console.log(Boolean(true)); // true (giá trị true)
console.log(Boolean(1)); // true (số nguyên dương)
console.log(Boolean(-1)); // true (số nguyên âm)
console.log(Boolean(100n)); // true (số BigInt khác 0)
console.log(Boolean(1.5)); // true (số thực dương)
console.log(Boolean(-1.5)); // true (số thực âm)
console.log(Boolean("0")); // true (string khác rỗng)
console.log(Boolean("abc")); // true (string khác rỗng)
console.log(Boolean([])); // true (mảng - array)
console.log(Boolean({ x: 1 })); // true (đối tượng - object)
console.log(Boolean(Infinity)); // true (số dương vô cùng)
console.log(Boolean(-Infinity)); // true (số âm vô cùng)
console.log(Boolean(alert)); // true (hàm)

Ví dụ về các giá trị falsy:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

Các toán tử logic trong JavaScript

Sau đây là những kiến thức cơ bản cần biết về toán tử logic OR (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

3), AND (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

4. và NOT (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

5. trong JavaScript.

Toán tử OR (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

3)

Toán tử OR trong JavaScript kí hiệu là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

3 (tạm dịch là toán tử "hoặc").

Trong lập trình nói chung, toán tử OR trả về giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 nếu có ít nhất một toán hạng là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7, ngược lại sẽ trả về

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8.

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

Ngoài ra, bạn cũng có thể kết hợp nhiều toán tử OR:

console.log(true || true || true); // true
console.log(true || false || true); // true
console.log(false || true || false); // true
console.log(false || false || false); // false

Đó là với logic thông thông thường, còn JavaScript thì phức tạp hơn một chút.

Quá trình xử lý của toán tử OR (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

3)

Toán tử OR trong JavaScript sẽ tìm và trả về giá trị truthy đầu tiên. Nếu không có giá trị truthy nào thì kết quả sẽ là giá trị của toán hạng cuối cùng.

Quá trình xử lý như sau: Thứ tự thực hiện từ trái sang phải. Lần lượt chuyển mỗi toán hạng về kiểu boolean. Nếu kết quả là

console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

7 thì trả về giá trị gốc của toán hạng đó và dừng lại.

Nếu kết quả là

console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

8 thì tiếp tục thực hiện với toán hạng tiếp theo.

• Nếu không có giá trị truthy nào thì kết quả trả về là giá trị của toán hạng cuối cùng.

Ví dụ:

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

Ứng dụng của toán tử OR trong JavaScript là gì?

Toán tử OR được dùng nhiều với câu lệnh

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

5.

Nếu bạn chưa biết câu lệnh

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

5 là gì, thì đơn giản câu lệnh

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

5 dùng để kiểm tra điều kiện, nếu đúng sẽ thực hiện một hành động (mình sẽ có bài viết chi tiết về

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

5 sau).

if (/* true */) {
  // làm gì đó ở đây
}

Ví dụ:

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

Ví dụ kết hợp toán tử so sánh:

const hour = 20;
if (hour < 9 || hour > 17) {
  console.log("Ngoài giờ làm việc"); // câu lệnh này được thực hiện
}

📝 Chú ý: toán tử so sánh có độ ưu tiên cao hơn toán tử logic, nên toán tử so sánh được thực hiện trước toán tử OR.

Vì

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

9 bằng

if (/* true */) {
  // làm gì đó ở đây
}

0 nên

if (/* true */) {
  // làm gì đó ở đây
}

1 là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8 và

if (/* true */) {
  // làm gì đó ở đây
}

3 là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7. Nghĩa là

if (/* true */) {
  // làm gì đó ở đây
}

5 có thể quy đổi thành

if (/* true */) {
  // làm gì đó ở đây
}

6. Suy ra, kết quả cuối cùng là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7.

Do đó, câu lệnh

if (/* true */) {
  // làm gì đó ở đây
}

8 được thực hiện.

Toán tử OR được dùng để lấy ra giá trị truthy đầu tiên trong các giá trị.

Ví dụ bài toán hiển thị tên người dùng trên trang web, biết thông tin người dùng có hai trường liên quan đến tên là

if (/* true */) {
  // làm gì đó ở đây
}

9 và

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

0.

Ưu tiên hiển thị tên

if (/* true */) {
  // làm gì đó ở đây
}

9 trước. Nếu

if (/* true */) {
  // làm gì đó ở đây
}

9 rỗng thì hiển thị

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

0. Nếu

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

0 cũng rỗng thì hiển thị "Người dùng ẩn danh".

Với bài toán này, bạn có thể sử dụng toán tử OR như sau:

const fullName = "";
const nickName = "jsDev";
const displayName = fullName || nickName || "Người dùng ẩn danh";
console.log(displayName); // jsDev

Toán tử OR có thể dùng cho "short-circuit evaluation"

Đặc điểm của toán tử OR trong JavaScript là sẽ xử lý các toán hạng cho đến khi tìm được giá trị truthy mới thôi.

Nhưng bạn cần chú ý, toán hạng ở đây không chỉ là giá trị, mà còn có thể là một biểu thức gán, hàm hoặc một câu lệnh,...

Ví dụ:

true || console.log("Câu lệnh này không được thực hiện"); // (1)
false || console.log("Câu lệnh này được thực hiện"); // (2)

Câu lệnh

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

5 (1) không được thực hiện. Vì toán tử OR gặp giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 đầu tiên, sẽ dừng lại và trả về giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 luôn, không xử lý gì toán hạng tiếp theo.

Câu lệnh

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

5 (2) được thực hiện. Vì toán tử OR gặp giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8 đầu tiên. Đây là giá trị falsy nên toán tử OR tiếp tục xử lý toán hạng thứ hai.

Vì vậy, câu lệnh

const hour = 20;
if (hour < 9 || hour > 17) {
  console.log("Ngoài giờ làm việc"); // câu lệnh này được thực hiện
}

0 được thực hiện.

💡 Tổng quát, tính năng này được dùng để thực hiện một hành động nếu điều kiện bên trái là falsy.

Tuy nhiên để dễ theo dõi code hơn, mình khuyên bạn nên sử dụng

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1) console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2) console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10) console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100) console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

5 thay vì dùng toán tử OR làm "short-circuit evaluation".

Toán tử AND (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

4)

Toán tử AND trong JavaScript kí hiệu là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

4 (tạm dịch là toán tử "và").

Trong lập trình nói chung, toán tử AND trả về giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 nếu cả hai toán hạng là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7, ngược lại sẽ trả về

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8.

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

0

Ngoài ra, bạn cũng có thể kết hợp nhiều toán tử AND:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

1

Quá trình xử lý của toán tử AND (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

4)

Toán tử AND trong JavaScript sẽ tìm và trả về giá trị falsy đầu tiên. Nếu không có giá trị falsy nào thì kết quả sẽ là giá trị của toán hạng cuối cùng.

Quá trình xử lý như sau: Thứ tự thực hiện từ trái sang phải. Lần lượt chuyển mỗi toán hạng về kiểu boolean. Nếu kết quả là

console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

8 thì trả về giá trị gốc của toán hạng đó và dừng lại.

Nếu kết quả là

console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

7 thì tiếp tục thực hiện với toán hạng tiếp theo.

• Nếu không có giá trị falsy nào thì kết quả trả về là giá trị của toán hạng cuối cùng.

Ví dụ:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

2

Ứng dụng của toán tử AND trong JavaScript là gì?

Toán tử AND được dùng nhiều với câu lệnh

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

5.

Tương tự như toán tử OR ở trên, toán tử AND cũng hay dùng với câu lệnh

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

5

Ví dụ:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

3

Ví dụ kết hợp toán tử so sánh:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

4

📝 Chú ý: toán tử so sánh có độ ưu tiên cao hơn toán tử logic, nên toán tử so sánh được thực hiện trước toán tử AND.

Vì

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1)
console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2)
console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10)
console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100)
console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

9 bằng

const fullName = "";
const nickName = "jsDev";
const displayName = fullName || nickName || "Người dùng ẩn danh";
console.log(displayName); // jsDev

3 nên

const fullName = "";
const nickName = "jsDev";
const displayName = fullName || nickName || "Người dùng ẩn danh";
console.log(displayName); // jsDev

4 là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 và

const fullName = "";
const nickName = "jsDev";
const displayName = fullName || nickName || "Người dùng ẩn danh";
console.log(displayName); // jsDev

6 là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7. Nghĩa là

const fullName = "";
const nickName = "jsDev";
const displayName = fullName || nickName || "Người dùng ẩn danh";
console.log(displayName); // jsDev

8 có thể quy đổi thành

const fullName = "";
const nickName = "jsDev";
const displayName = fullName || nickName || "Người dùng ẩn danh";
console.log(displayName); // jsDev

9. Suy ra, kết quả cuối cùng là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7.

Do đó, câu lệnh

true || console.log("Câu lệnh này không được thực hiện"); // (1)
false || console.log("Câu lệnh này được thực hiện"); // (2)

1 được thực hiện.

Toán tử AND có thể dùng cho "short-circuit evaluation"

Tương tự như toán tử OR, toán tử AND cũng có thể dùng cho "short-circuit evaluation".

Vì đặc điểm của toán tử AND trong JavaScript là sẽ xử lý các toán hạng cho đến khi tìm được giá trị falsy mới thôi.

Ví dụ:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

5

Câu lệnh

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

5 (1) được thực hiện. Vì toán tử AND gặp giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 đầu tiên. Đây là giá trị truthy nên toán tử AND tiếp tục xử lý toán hạng thứ hai. Vì vậy, câu lệnh

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

5 (1) được thực hiện.

Câu lệnh

const a = 1;
const b = 0;
if (a || b) {
  console.log("truthy!"); // câu lệnh này được thực hiện vì 1 || 0 trả về 1 - là truthy.
}

5 (2) không được thực hiện. Vì toán tử AND gặp giá trị falsy đầu tiên. Nên dừng lại luôn và không xử lý toán tử thứ hai.

💡 Tổng quát, tính năng này được dùng để thực hiện một hành động nếu điều kiện bên trái là truthy.

Để dễ theo dõi code hơn thì mình khuyên bạn nên sử dụng

console.log(1 || 0); // 1 (giá trị truthy đầu tiên là 1) console.log(null || 2); // 2 (giá trị truthy đầu tiên là 2) console.log("" || undefined || 0 || 10); // 10 (giá trị truthy đầu tiên là 10) console.log(null || 100 || 5 || undefined); // 100 (giá trị truthy đầu tiên là 100) console.log("" || 0 || null); // null (không có giá trị truthy, trả về giá trị cuối cùng)

5 thay vì dùng toán tử AND làm "short-circuit evaluation".

Toán tử NOT (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

5)

Toán tử NOT trong JavaScript kí hiệu là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

5 (tạm dịch là toán tử "phủ định").

Trong lập trình nói chung, toán tử NOT trả về giá trị

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7 nếu toán hạng là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8 và trả về

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

8 nếu toán hạng là

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

7.

Vì là toán tử một ngôi, nên toán tử NOT chỉ chứa một toán hạng, ví dụ:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

6

Quá trình xử lý của toán tử NOT như sau: Chuyển giá trị của toán hạng về dạng boolean:

console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

7 hoặc

console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

8.

Rồi trả về giá trị ngược lại.

Ví dụ:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

7

Nếu bạn sử dụng hai toán tử NOT

console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

05 thì nó sẽ có tác dụng chuyển đổi kiểu dữ liệu về giá trị boolean, giống hàm

console.log(true || true || true); // true console.log(true || false || true); // true console.log(false || true || false); // true console.log(false || false || false); // false

3 mà mình đã nhắc ở đầu.

Ví dụ:

console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

8

Bởi vì toán tử NOT đầu tiên

console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

5 đã chuyển giá trị về boolean rồi trả về giá trị ngược lại. Toán tử NOT thứ hai

console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

5 lại trả về giá trị ngược lại một lần nữa. Kết hợp lại thì sẽ tương đương với chuyển giá trị ban đầu về boolean.

Hay nói gắn gọn lại là: "phủ định của phủ định thành khẳng định".

Thứ tự ưu tiên của các toán tử logic

Nếu so sánh với các toán tử đã học như toán tử số học và toán tử so sánh thì toán tử logic trong JavaScript có độ ưu tiên thấp hơn.

Nếu so sánh thứ tự ưu tiên của các toán tử logic trong JavaScript với nhau thì toán tử NOT (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

5. có độ ưu tiên cao nhất. Xếp thứ hai là toán tử AND (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

4). Và cuối cùng là toán tử OR (

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

3).

Ví dụ:

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

9

Dựa theo độ ưu tiên thì quá trình thực hiện sẽ như sau (mình sử dụng cặp dấu ngoặc đơn

console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false (string rỗng)
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

12 để biểu thị phần được xử lý trước):

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

0

Tổng kết

Sau đây là một số kiến thức cơ bản cần nhớ về các toán tử logic trong JavaScript:

• Các toán tử logic trong JavaScript bao gồm: toán tử OR

  console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

  3, toán tử AND

  console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

  4, toán tử NOT

  console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

  5 và toán tử "Nullish Coalescing"

  console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

  6 (sẽ tìm hiểu ở bài viết sau).
• Truthy là những giá trị mà khi chuyển về kiểu dữ liệu boolean ra giá trị

  console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

  7. Falsy là những giá trị mà khi chuyển về kiểu dữ liệu boolean ra giá trị

  console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

  8.
• Toán tử OR tìm và trả về giá trị của toán hạng truthy đầu tiên. Nếu không có giá trị truthy nào thì toán tử OR trả về giá trị của toán hạng cuối cùng.
• Toán tử AND tìm và trả về giá trị của toán hạng falsy đầu tiên. Nếu không có giá trị falsy nào thì toán tử AND trả về giá trị của toán hạng cuối cùng.
• Toán tử NOT sẽ chuyển giá trị của toán hạng về kiểu dữ liệu boolean rồi lấy giá trị phủ định.
• So sánh với các toán tử đã học (toán tử số học, toán tử so sánh) thì toán tử logic có độ ưu tiên thấp hơn.
• Trong các toán tử logic trong JavaScript, toán tử NOT có độ ưu tiên cao nhất, sau đó đến toán tử AND và cuối cùng là toán tử OR.

Thực hành

Kết quả của các biểu thức sau là gì?

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

1

Xem đáp án

console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

2

Giải thích:

1. Toán tử OR: Giá trị truthy đầu tiên là

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   19 (string khác rỗng).
2. Toán tử OR: Không có giá trị truthy nào nên đáp án là giá trị của toán hạng cuối cùng

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   20.
3. Toán tử AND: Giá trị falsy đầu tiên là

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   21.
4. Toán tử AND: Giá trị falsy đầu tiên là false.
5. Toán tử so sánh có độ ưu tiên cao hơn nên thực hiện trước. Mà

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   22 trả về

   console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

   7 vì đây là so sánh khác kiểu dữ liệu. String

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   19 chuyển về dạng số thành số

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   25. Tiếp theo,

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   26 trả về

   console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

   8 vì

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   28 chỉ bằng

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   29 và khác tất cả các giá trị còn lại. Nên biểu thức ban đầu tương đương với

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   30. Vì vậy, kết quả là

   console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

   8.
6. Tương tự, toán tử so sánh thực hiện trước. Đầu tiên

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   32 trả về

   console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

   7. Thứ hai

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   34 trả về

   console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

   8 vì đây là so sánh bằng "nghiêm ngặt", mà hai toán hạng khác kiểu dữ liệu. Nên biểu thức ban đầu tương đương với

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   36. Vì vậy, kết quả là

   console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

   7.
7. Toán tử so sánh thực hiện trước. Do đó

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   38 thực hiện trước. Đây là so sánh string nên sẽ so sánh từng kí tự một. Thành phần

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   39 là giống nhau, mà

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   40 lớn hơn

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   41 (theo bảng mã Unicode). Nên

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   38 trả về false. Tiếp theo, toán tử NOT có độ ưu tiên cao hơn AND, nên

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   43 thực hiện trước. Mà

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   43 trả về

   console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

   7. Nên biểu thức ban đầu tương đương với

   console.log(Boolean(false)); // false console.log(Boolean(0)); // false console.log(Boolean("")); // false (string rỗng) console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false

   30. Vì vậy, kết quả là

   console.log(true || true); // true console.log(true || false); // true console.log(false || true); // true console.log(false || false); // false

   8.

★ Nếu bạn thấy bài viết này hay thì hãy theo dõi mình trên Facebook để nhận được thông báo khi có bài viết mới nhất nhé: