Type de condition pour ts Advanced

Développeurs frontaux àJavascriptLes expressions TERNAIRES dans devraient être familières,L'utilisation d'expressions TERNAIRES permet d'obtenir facilement des résultats de sortie différents en fonction de la valeur d'entrée. TypeScriptUne syntaxe similaire est fournie pour les types,EtJavascriptLa seule différence estTypeScriptC'est le type de données qui fonctionne.

Syntaxe de base

Utilisation de base

 T extends U ? X : Y;

• TUXY Quatre sont des substituants,Représente quatre types de;
• T extends U Représentation TLe type peut être attribué àUType,Il s'agit aussi deTSCompatibilité des types.

Quelques exemples simples

• Déterminer si le type eststringType

type IsString<T> = T extends string ? true : false;

type C11 = IsString<string>; // true
type C22 = IsString<number>;   // false

type C1 = IsString<"1">; // true
type C2 = IsString<1>;   // false

Points saillants：Dans l'exempletrueEt falseType(Type littéral),Ce n'est pas une valeur.

• Si ouiAnimalType obtenunumberType,SinonstringType

interface Animal {
  live(): void;
}
interface Dog extends Animal {
  woof(): void;
}

type IsAnimal<T> = T extends Animal ? number : string;
type C3 = IsAnimal<Dog> // number
type C4 = IsAnimal<RegExp> // string

TSAvancékeyofExemples dans

• RéalisationOmit

type MyOmit<T, K> = { [P in keyof T as P extends K ? never : P]: T[P] };

• Ajouter des propriétés au type d'objet

type AppendToObject<T, U extends keyof any, V> = {[P in keyof T | U]: P extends keyof T ? T[P] : V}

Le type de condition peut être utilisé en combinaison

Voici quelques exemples:： Obtenir le nom du type

type TypeName<T> = T extends string
  ? 'string'
  : T extends number
  ? 'number'
  : T extends boolean
  ? 'boolean'
  : T extends undefined
  ? 'undefined'
  : T extends Function
  ? 'function'
  : 'object';

Cette méthode d'utilisation devrait également être mieux comprise. ,Mais plus d'explications.

Propriétés de distribution du type de condition

Si oui Propriétés de distribution du type de condition Les étudiants moins familiers peuvent avoir raison Exclude,Extract Mise en œuvre douteuse de types d'outils similaires ,Je vais utiliserExclude Pour plus de détails Propriétés de distribution du type de condition .

Points saillants： Les caractéristiques de distribution conditionnelle sont principalement destinées à: TC'est un type d'union.

ExcludeLogique d'exécution spécifique pour

type Exclude<T, U> = T extends U ? never : T;
type C5 = Exclude<'a' | 'b' | 'c', 'a' | 'b'> // 'c'

Explication：

1. Type d'union T La distribution devient :

'a' extends 'a'| 'b' ? never : 'a' |
'b' extends 'a'| 'b' ? never : 'b' | 
'c' extends 'a'| 'b' ? never : 'c'

2. Les résultats calculés séparément sont les suivants: never ｜ never ｜ 'c'
3. Résultats finaux: c

La distribution d'un type de condition doit être de type nu

Le type nu signifie qu'il n'est pas Tableau,TupleEtPromise Type d'emballage .

Voici quelques exemples de comparaison: :

type IsString2<T> = [T] extends string[] ? "IS a String" : "Not a String";
type C7 = IsString2<string | number>; 
// Résultats: "Not a String"

type IsString3<T> = T extends string ? "IS a String" : "Not a String";
type C8 = IsString3<string | number>; 
// Résultats: "IS a String" | "Not a String"

1. IsString2Dans[T] Enveloppé dans un tableau ,Pas de distribution,Jugement direct[string | number] extends string[], Je l'ai."Not a String";
2. IsString3Dans[T] Non emballé ,Sera distribué,Je l'ai."IS a String" | "Not a String";

never Est un type de Fédération vide

Si vous décidez si un type est never, Peut - être que la première pensée :

type IsNever<T> = T extends never ? true : false; // 

C'est mal,Parce que never Représente un type de Fédération vide ,équivalent à aucun, Tout ne sera pas exécuté ,Et enfinneverType, Non. true.

La bonne logique de résolution est de never Changez - le en Tuple. .

type IsNever<T> = [T] extends [never] ? true : false; // 

Quelques cas

Obtient le type du premier élément du type de tableau

type First<T extends any[]> = T extends never[] ? never : T[0];  

type arr1 = ['a', 'b', 'c']
type C6 = First<arr1> // 'a'

Attention! Ici.'a','b','c',Type,Type,Type;

Pick A un certain type d'attribut

type PickByType<T, U> = { [P in keyof T as T[P] extends U ? P : never]: T[P] };

type OnlyBoolean = PickByType<{
  name: string
  count: number
  isReadonly: boolean
  isEnable: boolean
}, boolean>

// Résultats：
{
   isReadonly: boolean;
    isEnable: boolean;
}

JugementAny

export type IsAny<T> = 0 extends (1 & T) ? true : false

type IsAny<T> = 0 extends (1 & T) ? true : false
type C9 = IsAny<any>; // true
type C10 = IsAny<string>; // false

Explication: any & 1 = any, 0 extends any Fondé,Alors revenez.true; Adresse d'explication spécifique

Déterminer si les deux types sont exactement égaux

export type Equal<X, Y> =
  (<T>() => T extends X ? 1 : 2) extends
  (<T>() => T extends Y ? 1 : 2) ? true : false
  

Explication： Comparer si deux types de fonctions sont exactement égaux en construisant un type de fonction . Adresse d'explication spécifique

infer

Peut être utilisé dans la syntaxe de type conditionnel inferInférence de type, La deuxième partie porte sur cette partie. .

Voici un exemple officiel du type de paramètre get :

type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never;