`truthy` e `falsy` in TypeScript

In questo articolo spiegheremo i concetti di truthy e falsy in TypeScript.

YouTube Video

truthy e falsy in TypeScript

I concetti di truthy e falsy in TypeScript svolgono un ruolo molto importante nelle istruzioni condizionali del programma. Qui spiegheremo questi concetti in dettaglio e come vengono effettivamente utilizzati. Inoltre, forniremo esempi pratici di codice TypeScript per comprendere come vengono gestiti i valori truthy e falsy.

Cosa sono truthy e falsy?

In JavaScript e TypeScript, qualsiasi valore viene valutato come true (true) o false (false) in un'espressione condizionale. Questi valori sono logicamente classificati come truthy o falsy.

• truthy si riferisce a valori che sono valutati come true nelle espressioni condizionali.
• falsy si riferisce a valori che sono valutati come false nelle espressioni condizionali.

In TypeScript, i seguenti valori sono considerati falsy:.

2. Il numero 0
3. "" (stringa vuota)

Tutti gli altri valori sono considerati truthy.

Esempi specifici di truthy e 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");

Condizionali con l'uso di truthy e falsy

I concetti di truthy e falsy sono spesso utilizzati nelle condizioni e nei cicli. Ad esempio, nelle istruzioni if o nei cicli while, è possibile utilizzare direttamente questi valori per semplici valutazioni condizionali.

 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}

Gestione dei valori falsy con ?? (Nullish Coalescing) e || (OR logico)

In TypeScript, esistono diversi operatori utili per gestire i valori falsy. In particolare, l'Operatore di Fusione Nullish (??) e l'operatore OR logico (||) sono comunemente utilizzati.

|| (Logical OR)

L'operatore OR logico viene utilizzato per sostituire i valori falsy con un valore predefinito. Tuttavia, tutti i valori considerati falsy (non solo null e undefined, ma anche 0 e le stringhe vuote "") sono inclusi.

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

??（Nullish Coalescing）

L'operatore di coalescenza nullish applica il valore predefinito solo a null o undefined, e tratta altri valori falsy come 0 o stringhe vuote "" così come sono.

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

Insidie relative a truthy e falsy

Un punto cruciale da considerare quando si comprende truthy e falsy è che valori non intenzionali potrebbero essere trattati come falsy. Ad esempio, 0 e stringhe vuote "" sono valori validi, ma sono considerati falsy nelle dichiarazioni condizionali, il che potrebbe portare a valutazioni errate.

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}

In questi casi, l'utilizzo di operatori di confronto rigorosi consente di distinguere con precisione valori come 0 e false.

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

Insidie legate a falsy e NaN

NaN richiede un trattamento speciale perché non è uguale a nessun valore, nemmeno a se stesso, quando si utilizzano gli operatori di confronto.

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

Pertanto, è più sicuro utilizzare Number.isNaN() per rilevare con precisione 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}

Come tale, NaN non è nemmeno uguale a se stesso, quindi i confronti con NaN restituiscono sempre false. Utilizzando invece Number.isNaN(), è possibile eseguire controlli più affidabili.

Conclusione

I concetti di truthy e falsy in TypeScript sono molto utili, ma è necessario prestare attenzione a determinati valori, in particolare 0 e stringhe vuote. Quando si utilizzano questi valori nei controlli condizionali, l'uso di confronti rigorosi (===) o dell'Operatore di Fusione Nullish (??) invece di confronti approssimativi (==) può aiutare ad evitare comportamenti imprevisti.

Puoi seguire l'articolo sopra utilizzando Visual Studio Code sul nostro canale YouTube. Controlla anche il nostro canale YouTube.

YouTube Video