La simplification tapuscrit types à l'intérieur de type popup

Question 1

Est-il possible de simplifier le type qui est affiché dans l'info-bulle qui est visible lorsque j'ai passez la souris sur une variable dans la Machine?

J'ai le code suivant:

type Debug<T> = {
    [key in keyof T]: T[key]
}

type Chainable<Acc = {}> = {
    option: <K extends string, V>(key: K, value: V) => Chainable<Acc & {[k in K]: V}>;
    get: () => Debug<Acc>;
}

declare const config: Chainable
const result = config
  .option('foo', 123)
  .option('name', 'type-challenges')
  .option('bar', { value: 'Hello World' })
  .get()


type X = typeof result;

Quand j'ai passez la souris sur result variable-je obtenir: [ hovering over result variable 1

Cependant, quand j'ai passez la souris sur type X Je vois:

Questions:

Pourquoi ces types représentés différemment? (Même si elles représentent la même chose)
Est-il possible d'afficher le type de comme il est indiqué dans le deuxième écran?

aire de jeux

Question 2

Vous pourriez faire quelque chose comme:

type Chainable<Acc = {}> = {
    option: <K extends string, V>(key: K, value: V) => Chainable<{[k in K | keyof Acc]: k extends keyof Acc ? Acc[k] : V}>;
    get: () => Debug<Acc>;
}

Fondamentalement, c'est de faire la même chose que ce que vous faites, mais dans un tour de plus sur manière.

Au lieu de s'appuyer sur & paramètre qui vont polluer le hover soupçon. Vous pouvez recréer la totalité de l'objet à partir de zéro.

Ceci est réalisé en utilisant k in K | keyof Acc comme la clé mais cela signifie également que vous avez besoin d'un conditionnel de type pour la valeur.

J'imagine que ce peut-être moins performant, mais honnêtement, je ne pense pas qu'il va faire la plus grande différence.

Aire de jeux

Question 3

C'est un principale différence entre les type mot-clé et la interface mot-clé. Interface noms apparaissent dans les info-bulles, mais les noms de type de ne pas.

Question 4

Il semble qu'il est possible de créer un type utilitaire qui va faire l'aplatissement automatiquement. Donc, il n'est pas nécessaire de disséquer le type de la façon dont @zecuria fait.

type Chainable<Acc = {}> = {
    option: <K extends string, V>(key: K, value: V) => Chainable<Acc & {[k in K]: V}>;
    get: () => Util_FlatType<Acc>;
}

type Util_FlatType<T> = T extends object ? { [K in keyof T]: Util_FlatType<T[K]> } : T

Util_FlatType de vol à partir d' ici

zecuria · Answer 1 · 2021-11-24T03:11:45

Vous pourriez faire quelque chose comme:

type Chainable<Acc = {}> = {
    option: <K extends string, V>(key: K, value: V) => Chainable<{[k in K | keyof Acc]: k extends keyof Acc ? Acc[k] : V}>;
    get: () => Debug<Acc>;
}

Fondamentalement, c'est de faire la même chose que ce que vous faites, mais dans un tour de plus sur manière.

Au lieu de s'appuyer sur & paramètre qui vont polluer le hover soupçon. Vous pouvez recréer la totalité de l'objet à partir de zéro.

Ceci est réalisé en utilisant k in K | keyof Acc comme la clé mais cela signifie également que vous avez besoin d'un conditionnel de type pour la valeur.

J'imagine que ce peut-être moins performant, mais honnêtement, je ne pense pas qu'il va faire la plus grande différence.

Aire de jeux

Ron Newcomb · Answer 2 · 2021-11-24T03:36:18

C'est un principale différence entre les type mot-clé et la interface mot-clé. Interface noms apparaissent dans les info-bulles, mais les noms de type de ne pas.

paroxyzm · Answer 3 · 2021-11-28T15:00:21

Il semble qu'il est possible de créer un type utilitaire qui va faire l'aplatissement automatiquement. Donc, il n'est pas nécessaire de disséquer le type de la façon dont @zecuria fait.

type Chainable<Acc = {}> = {
    option: <K extends string, V>(key: K, value: V) => Chainable<Acc & {[k in K]: V}>;
    get: () => Util_FlatType<Acc>;
}

type Util_FlatType<T> = T extends object ? { [K in keyof T]: Util_FlatType<T[K]> } : T

Util_FlatType de vol à partir d' ici

La simplification tapuscrit types à l'intérieur de type popup

La question

La meilleure réponse

Dans d'autres langues

Cette page est dans d'autres langues

Populaires dans cette catégorie

Questions populaires dans cette catégorie