Упрощение типов машинописного текста внутри всплывающего окна типа

Question 1

Можно ли упростить тип, отображаемый во всплывающей подсказке типа, которая отображается при наведении курсора мыши на переменную в Typescript?

У меня есть следующий код:

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;

Когда я нависаю над result переменная, которую я получаю: [ hovering over result variable 1

Однако, когда я наведу курсор на type X Я вижу:

Вопросы:

Почему эти типы показаны по-разному? (Даже если они представляют одно и то же)
Есть ли способ показать тип, как он показан на втором экране?

игровая площадка

Question 2

Вы могли бы сделать что-то вроде:

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>;
}

По сути, это то же самое, что и то, что вы делаете, но более окольным путем.

Вместо того, чтобы полагаться на & параметр, который будет загрязнять подсказку при наведении курсора. Вы можете эффективно воссоздать весь объект с нуля.

Это достигается за счет использования k in K | keyof Acc как ключ, но это также означает, что вам нужен условный тип для значения.

Я полагаю, что это, возможно, менее эффективно, но, честно говоря, я не думаю, что это будет иметь наибольшее значение.

Игровая площадка

Question 3

Это основное различие между type ключевое слово и interface ключевое слово. Имена интерфейсов отображаются во всплывающих подсказках, но имена типов-нет.

Question 4

Похоже, можно создать тип утилиты, который будет выполнять выравнивание автоматически. Таким образом, нет необходимости анализировать тип, как это сделал @zecuria.

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 украден отсюда

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

Вы могли бы сделать что-то вроде:

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>;
}

По сути, это то же самое, что и то, что вы делаете, но более окольным путем.

Вместо того, чтобы полагаться на & параметр, который будет загрязнять подсказку при наведении курсора. Вы можете эффективно воссоздать весь объект с нуля.

Это достигается за счет использования k in K | keyof Acc как ключ, но это также означает, что вам нужен условный тип для значения.

Я полагаю, что это, возможно, менее эффективно, но, честно говоря, я не думаю, что это будет иметь наибольшее значение.

Игровая площадка

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

Это основное различие между type ключевое слово и interface ключевое слово. Имена интерфейсов отображаются во всплывающих подсказках, но имена типов-нет.

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

Похоже, можно создать тип утилиты, который будет выполнять выравнивание автоматически. Таким образом, нет необходимости анализировать тип, как это сделал @zecuria.

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 украден отсюда

Упрощение типов машинописного текста внутри всплывающего окна типа

Вопрос

Лучший ответ

На других языках

Эта страница на других языках

Популярное в этой категории

Популярные вопросы в этой категории