`Truthy` и `Falsy` в TypeScript

В этой статье мы объясним, что такое truthy и falsy в TypeScript.

YouTube Video

Truthy и Falsy в TypeScript

Концепции truthy и falsy в TypeScript играют очень важную роль в условных выражениях программ. Здесь мы подробно объясним эти концепции и как они используются на практике. Кроме того, мы приведем конкретные примеры кода на TypeScript, чтобы понять, как обрабатываются значения truthy и falsy.

Что такое truthy и falsy?

В JavaScript и TypeScript любое значение оценивается как истинное (true) или ложное (false) в условных выражениях. Эти значения логически классифицируются как truthy или falsy.

• truthy относится к значениям, которые оцениваются как true в условных выражениях.
• falsy относится к значениям, которые оцениваются как false в условных выражениях.

В TypeScript следующие значения считаются falsy:.

2. Число 0
3. "" (пустая строка)

Все остальные значения считаются truthy.

Конкретные примеры «истинных» и «ложных» значений (truthy и 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");

Условные выражения с использованием «истинных» и «ложных» значений (truthy и falsy)

Концепции truthy и falsy часто используются в условных выражениях и циклах. Например, в операторах if или циклах while эти значения можно использовать напрямую для простых оценок условий.

 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}

Обработка «ложных» значений (falsy) с помощью операторов ?? (нулевое слияние) и || (логическое ИЛИ)

В TypeScript есть несколько операторов, которые полезны при работе с falsy значениями. В частности, оператор объединения с null (??) и логический оператор ИЛИ (||) часто используются.

|| (логическое или)

Логический оператор ИЛИ используется для замены falsy значений на значение по умолчанию. Однако все значения, считающиеся «ложными» (falsy) (не только null и undefined, но также 0 и пустые строки ""), также включены.

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

??（Nullish Coalescing）

Оператор слияния с null (nullish coalescing) применяет значение по умолчанию только к null или undefined, а другие «ложные» (falsy) значения, такие как 0 или пустые строки "", оставляет без изменений.

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

Подводные камни, связанные с «истинными» и «ложными» значениями (truthy и falsy)

Ключевой момент, на который следует обратить внимание при понимании истинных и ложных значений, заключается в том, что непреднамеренные значения могут быть признаны ложными. Например, 0 и пустые строки "" являются допустимыми значениями, но они считаются ложными в условных операторах, что может привести к неверным оценкам.

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}

В таких случаях использование операторов строгого сравнения позволяет точно различать значения, такие как 0 и false.

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

Подводные камни, связанные с falsy и NaN

NaN требует особой обработки, поскольку он не равен ни одному значению, включая себя, если используются операторы сравнения.

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

Поэтому безопаснее использовать Number.isNaN() для точного определения NaN.

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

Таким образом, NaN даже не равен самому себе, поэтому сравнения с NaN всегда возвращают false. Используя Number.isNaN() вместо этого, вы можете выполнять более надежные проверки.

Заключение

Концепции истинных и ложных значений в TypeScript очень удобны, но следует быть осторожным с некоторыми значениями, особенно с 0 и пустыми строками. При использовании этих значений в условных проверках применение строгого сравнения (===) или оператора объединения с null (??) вместо нестрогого сравнения (==) может помочь избежать неожиданного поведения.

Вы можете следовать этой статье, используя Visual Studio Code на нашем YouTube-канале. Пожалуйста, также посмотрите наш YouTube-канал.

YouTube Video