`truthy` và `falsy` trong TypeScript

Trong bài viết này, chúng tôi sẽ giải thích về truthy và falsy trong TypeScript.

YouTube Video

truthy và falsy trong TypeScript

Các khái niệm truthy và falsy trong TypeScript đóng vai trò rất quan trọng trong các câu lệnh điều kiện của chương trình. Tại đây, chúng tôi sẽ giải thích chi tiết về các khái niệm này và cách chúng được áp dụng thực tế. Hơn nữa, chúng tôi cung cấp các ví dụ mã TypeScript cụ thể để hiểu cách xử lý các giá trị truthy và falsy.

Truthy và Falsy là gì?

Trong JavaScript và TypeScript, mọi giá trị đều được đánh giá là đúng (true) hoặc sai (false) trong một biểu thức điều kiện. Những giá trị này được phân loại logic thành truthy hoặc falsy.

• truthy dùng để chỉ các giá trị được đánh giá là true trong các biểu thức điều kiện.
• falsy dùng để chỉ các giá trị được đánh giá là false trong các biểu thức điều kiện.

Trong TypeScript, các giá trị sau được coi là falsy:.

2. Số 0
3. "" (chuỗi rỗng)

Tất cả các giá trị khác được coi là truthy.

Các ví dụ cụ thể về truthy và falsy

 1// Examples of falsy values
 2console.log("0 is", Boolean(0) ? "truthy" : "falsy");
 3console.log('"" is', Boolean("") ? "truthy" : "falsy");
 4console.log("null is", Boolean(null) ? "truthy" : "falsy");
 5console.log("undefined is", Boolean(undefined) ? "truthy" : "falsy");
 6console.log("NaN is", Boolean(NaN) ? "truthy" : "falsy");
 7
 8// Examples of truthy values
 9console.log("1 is", Boolean(1) ? "truthy" : "falsy");
10console.log('"hello" is', Boolean("hello") ? "truthy" : "falsy");
11console.log("[] is", Boolean([]) ? "truthy" : "falsy");
12console.log('" " (space) is', Boolean(" ") ? "truthy" : "falsy");

Các câu điều kiện sử dụng truthy và falsy

Các khái niệm truthy và falsy thường được sử dụng trong điều kiện và vòng lặp. Ví dụ, trong các câu lệnh if hoặc vòng lặp while, bạn có thể sử dụng các giá trị này trực tiếp để đánh giá điều kiện đơn giản.

 1// Checking if the length of the array is 0
 2let items: string[] = [];
 3
 4if (items.length) {
 5    console.log("The array is not empty");
 6} else {
 7    console.log("The array is empty");
 8}
 9
10// Checking if the input value is empty
11let input = "";
12
13if (input) {
14    console.log("Input has value");
15} else {
16    console.log("Input is empty"); // This will be executed
17}

Xử lý các giá trị falsy bằng ?? (Nullish Coalescing) và || (Logical OR)

Trong TypeScript, có một số toán tử rất hữu ích khi làm việc với các giá trị falsy. Cụ thể, Toán tử hợp nhất Nullish (??) và toán tử HOẶC logic (||) thường được sử dụng.

|| (Hoặc logic)

Toán tử HOẶC logic được sử dụng để thay thế các giá trị falsy bằng một giá trị mặc định. Tuy nhiên, tất cả các giá trị falsy (không chỉ null hoặc undefined, mà còn 0, "", v.v.) đều được áp dụng.

1let username = "";
2let displayName = username || "Guest"; // Since username is empty, "Guest" is assigned
3
4console.log(displayName); // "Guest"

??（Nullish Coalescing）

Toán tử hợp nhất Nullish chỉ áp dụng giá trị mặc định cho null hoặc undefined, giữ nguyên các giá trị falsy khác (như 0 hoặc "").

1let username2 = "";
2let displayName2 = username2 ?? "Guest";
3// The empty string is retained
4// since username2 is not null or undefined
5
6console.log(displayName2); // ""

Những rủi ro liên quan đến truthy và falsy

Một điểm quan trọng cần lưu ý khi hiểu truthy và falsy là các giá trị không mong muốn có thể bị xem như falsy. Ví dụ, 0 và chuỗi trống "" là các giá trị hợp lệ, nhưng chúng được coi là falsy trong các câu lệnh điều kiện, điều này có thể dẫn đến các đánh giá không chính xác.

1let score = 0;
2
3if (score) {
4    console.log("You have a score!"); // This will not be executed
5} else {
6    console.log("No score available"); // This will be executed
7}

Trong những trường hợp như vậy, việc sử dụng toán tử so sánh nghiêm ngặt cho phép bạn phân biệt chính xác các giá trị như 0 và false.

1let score = 0;
2
3if (score === 0) {
4    console.log("Score is zero"); // Correctly evaluated
5}

Những cạm bẫy liên quan đến falsy và NaN

NaN cần xử lý đặc biệt vì nó không bằng bất kỳ giá trị nào, bao gồm cả chính nó, khi sử dụng các toán tử so sánh.

1console.log("NaN === NaN:", NaN === NaN); // false

Do đó, an toàn hơn khi sử dụng Number.isNaN() để phát hiện chính xác NaN.

 1// Bad Example
 2let value = parseInt("0");
 3if (!value) {
 4    console.log("Value is NaN"); // Incorrectly treats 0 as NaN
 5}
 6
 7// Good Example
 8let value2 = parseInt("hello");
 9if (Number.isNaN(value2)) {
10    console.log("Value is NaN"); // Correctly identifies NaN
11}

Vì vậy, NaN thậm chí không bằng chính nó, nên so sánh với NaN luôn trả về false. Bằng cách sử dụng Number.isNaN() thay thế, bạn có thể thực hiện các kiểm tra đáng tin cậy hơn.

Kết luận

Các khái niệm truthy và falsy trong TypeScript rất tiện lợi, nhưng bạn cần cẩn thận với một số giá trị nhất định, đặc biệt là 0 và các chuỗi trống. Khi sử dụng các giá trị này trong các kiểm tra điều kiện, sử dụng so sánh nghiêm ngặt (===) hoặc Toán tử hợp nhất Nullish (??) thay vì so sánh lỏng (==) có thể giúp tránh các hành vi không mong muốn.

Bạn có thể làm theo bài viết trên bằng cách sử dụng Visual Studio Code trên kênh YouTube của chúng tôi. Vui lòng ghé thăm kênh YouTube.

YouTube Video