Literaltypen in TypeScript beherrschen: true als const vs. true

In TypeScript gibt es einen wesentlichen Unterschied zwischen den beiden Anweisungen:

1. clientLoader.hydrate = true as const;

2. clientLoader.hydrate = true;

Zu Ihrer Information: Ich habe diese Beispiele vom React-Router v7 ausgewählt.

Lassen Sie uns den Unterschied mit detaillierten Erklärungen und Beispielen aufschlüsseln

1. clientLoader.hydrate = true as const;

Die as const-Behauptung in TypeScript ist eine Möglichkeit, den TypeScript-Compiler anzuweisen, einen Wert als seinen Literaltyp und nicht als allgemeinen Typ zu behandeln.
In diesem Fall bedeutet „true“ als „const“, dass der Hydrattyp das wörtliche „true“ und nicht der boolesche Wert ist. Es legt im Wesentlichen den Wert von Hydrat fest.

Beispiel:

interface ClientLoader {
  hydrate: true;  // The type of hydrate is set to the literal value `true`
}

const clientLoader: ClientLoader = {
  hydrate: true as const,
};

clientLoader.hydrate = true; // This is valid

// clientLoader.hydrate = false; // Error: Type 'false' is not assignable to type 'true'

• Im obigen Beispiel wird clientLoader.hydrate ausdrücklich als „true“ eingegeben. Aufgrund der as const-Behauptung können Sie hydrate keinen anderen Wert als „true“ zuweisen.

• Diese Art der Zuweisung ist nützlich, wenn Sie die Unveränderlichkeit für bestimmte Eigenschaften erzwingen möchten.

1. clientLoader.hydrate = true;

Ohne die as const-Behauptung leitet TypeScript den Typ des Hydrats als booleschen Wert ab. Das bedeutet, dass Hydrat jeder boolesche Wert (wahr oder falsch) zugewiesen werden kann.

Beispiel:

interface ClientLoader {
  hydrate: boolean;  // The type of hydrate is set to `boolean`
}

const clientLoader: ClientLoader = {
  hydrate: true,
};

clientLoader.hydrate = true;  // This is valid
clientLoader.hydrate = false; // This is also valid

• Da Hydrat in diesem Fall als boolescher Wert eingegeben wird, können Sie ihm „wahr“ oder „falsch“ zuweisen.

• Es bietet die Flexibilität, zwischen wahr und falsch zu wechseln.

Feature	clientLoader.hydrate = true as const;	clientLoader.hydrate = true;
Type of hydrate	true (literal type)	boolean (general type)
Flexibility	Can only be true	Can be true or false
Use Case	When you want the property to be strictly true and not allow changes	When the property can hold any boolean value
Type Inference	The type of hydrate is narrowed to true	The type of hydrate is inferred as boolean

Warum als const verwenden?

1. Unveränderlichkeit erzwingen: as const sperrt den Wert, sodass er nicht in etwas anderes geändert werden kann. Dies ist besonders nützlich, wenn Sie sicherstellen möchten, dass ein bestimmter Wert im gesamten Programm immer gleich ist.

2. Literaltypen für diskriminierte Gewerkschaften: Wenn Sie mit diskriminierten Gewerkschaften arbeiten, können Sie mit as const spezifische Fälle basierend auf Literaltypen erstellen, wie unten gezeigt:
   

interface ClientLoader {
  hydrate: true;  // The type of hydrate is set to the literal value `true`
}

const clientLoader: ClientLoader = {
  hydrate: true as const,
};

clientLoader.hydrate = true; // This is valid

// clientLoader.hydrate = false; // Error: Type 'false' is not assignable to type 'true'

Abschluss

1. Verwenden Sie es als const, wenn Sie einer Eigenschaft einen bestimmten Literalwert zuweisen und erzwingen möchten, dass der Wert fest bleibt.

2. Verwenden Sie eine reguläre Zuweisung (wahr, falsch usw.), wenn Sie einer Eigenschaft erlauben möchten, verschiedene boolesche Werte anzunehmen, oder wenn der genaue Wert nicht eingeschränkt werden muss.

Dies macht as const zu einem nützlichen Werkzeug für eine präzisere Eingabe und die Durchsetzung strengerer Wertbeschränkungen in Ihrem TypeScript-Code.

Das obige ist der detaillierte Inhalt vonLiteraltypen in TypeScript beherrschen: true als const vs. true. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!