`truthy` i `falsy` w TypeScript

`truthy` i `falsy` w TypeScript

W tym artykule wyjaśnimy pojęcia truthy i falsy w TypeScript.

YouTube Video

truthy i falsy w TypeScript

Pojęcia truthy i falsy odgrywają bardzo ważną rolę w instrukcjach warunkowych w TypeScript. Tutaj szczegółowo wyjaśnimy te pojęcia i sposób ich praktycznego zastosowania. Ponadto przedstawiamy konkretne przykłady kodu TypeScript, aby zrozumieć, jak obsługiwane są wartości truthy i falsy.

Czym są truthy i falsy?

W JavaScript i TypeScript każda wartość jest oceniana jako prawda (true) lub fałsz (false) w wyrażeniu warunkowym. Te wartości są logicznie klasyfikowane jako truthy lub falsy.

  • truthy odnosi się do wartości, które są oceniane jako true w wyrażeniach warunkowych.
  • falsy odnosi się do wartości, które są oceniane jako false w wyrażeniach warunkowych.

W TypeScript następujące wartości są traktowane jako falsy:.

  1. Liczba 0
  2. "" (pusty ciąg znaków)

Wszystkie inne wartości są traktowane jako truthy.

Konkretne przykłady wartości truthy i 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");

Instrukcje warunkowe z wykorzystaniem wartości truthy i falsy

Pojęcia truthy i falsy są często używane w warunkach i pętlach. Na przykład w instrukcjach if lub pętlach while można używać tych wartości bezpośrednio do prostych ocen warunkowych.

 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}

Obsługa wartości falsy za pomocą ?? (Nullish Coalescing) i || (operator logiczny LUB)

W TypeScript istnieje kilka operatorów przydatnych przy pracy z wartościami falsy. W szczególności często używa się operatora koalescencji nulli (??) oraz operatora logicznego LUB (||).

|| (operator logiczny LUB)

Operator logicznego LUB jest używany do zastąpienia wartości falsy wartością domyślną. Jednak wszystkie wartości uznawane za fałszywe (nie tylko null i undefined, ale także 0 i puste ciągi znaków "") są również uwzględnione.

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

??(Nullish Coalescing)

Operator nullish coalescing stosuje wartość domyślną tylko dla null lub undefined i traktuje inne wartości fałszywe, takie jak 0 lub puste ciągi znaków "", takimi jakimi są.

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

Pułapki związane z wartościami truthy i falsy

Kluczowym aspektem, na który należy uważać przy rozumieniu truthy i falsy, jest to, że niezamierzone wartości mogą być traktowane jako falsy. Na przykład 0 i puste ciągi znaków "" są wartościami prawidłowymi, ale są traktowane jako falsy w instrukcjach warunkowych, co może prowadzić do błędnych ocen.

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}

W takich przypadkach użycie operatorów ścisłego porównania pozwala precyzyjnie rozróżnić wartości takie jak 0 i false.

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

Pułapki związane z wartościami falsy i NaN

NaN wymaga specjalnego traktowania, ponieważ nie jest równy żadnej wartości, w tym samemu sobie, podczas używania operatorów porównania.

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

Dlatego bezpieczniej jest używać Number.isNaN(), aby dokładnie wykryć 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}

Jako takie, NaN nie jest nawet równe samo sobie, więc porównania z NaN zawsze zwracają false. Używając zamiast tego Number.isNaN(), można przeprowadzać bardziej niezawodne sprawdzenia.

Wnioski

Koncepcje truthy i falsy w TypeScript są bardzo wygodne, ale należy uważać na niektóre wartości, zwłaszcza 0 i puste ciągi znaków. Podczas używania tych wartości w warunkach warunkowych, stosowanie ścisłego porównania (===) lub operatora koalescencji nulli (??) zamiast luźnego porównania (==) może pomóc uniknąć nieoczekiwanego zachowania.

Możesz śledzić ten artykuł, korzystając z Visual Studio Code na naszym kanale YouTube. Proszę również sprawdzić nasz kanał YouTube.

YouTube Video