`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 falsy (nie tylko null czy undefined, ale także 0, "", itp.) są uwzględniane.

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

??(Nullish Coalescing)

Operator koalescencji nulli stosuje wartość domyślną tylko do null lub undefined, pozostawiając pozostałe wartości falsy (takie jak 0 czy "") bez zmian.

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"); // 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}

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