satisfies и аннотация типа
Сохраняйте вывод литеральных типов и одновременно проверяйте структуру
«satisfies и аннотация типа» — бесплатный урок TypeScript Academy на CoddyKit. Это урок 2 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения TypeScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс TypeScript Academy содержит 4 уроков всего.
Шаблон с аннотацией
Классический шаблон const config: Type = {...} проверяет объект, но типом переменной становится Type, из-за чего любые вложенные литералы расширяются.
type Config = { mode: string; level: number };
const config: Config = { mode: "dark", level: 5 };
// config.mode has type string
console.log(config.mode);Как выглядит расширение типов
При использовании аннотации config.mode имеет тип string. Вы не можете присвоить его переменной, ожидающей литерал "dark".
type Config = { mode: string };
const config: Config = { mode: "dark" };
// const m: "dark" = config.mode; // Error: string not assignable to "dark"
console.log(config.mode);Шаблон satisfies
При использовании const config = {...} satisfies Type переменная сохраняет свой точно выведенный тип, но при этом по-прежнему проверяется на соответствие Type.
type Config = { mode: string; level: number };
const config = { mode: "dark", level: 5 } satisfies Config;
// config.mode has type "dark"
console.log(config.mode);Точное выведение типов сохраняется
Теперь config.mode является литералом "dark", поэтому он работает везде, где требуется узкий тип.
type Config = { mode: string };
const config = { mode: "dark" } satisfies Config;
const m: "dark" = config.mode; // OK
console.log(m);Оба подхода по-прежнему проверяют
Оба шаблона отклоняют некорректные объекты. Различие заключается только в результирующем типе переменной, а не в том, выполняется ли проверка.
type Config = { level: number };
// const a: Config = { level: "x" }; // Error
// const b = { level: "x" } satisfies Config; // Error
const ok = { level: 3 } satisfies Config;
console.log(ok.level);Лишние свойства обнаруживаются
Как и аннотации, satisfies отмечает лишние свойства, отсутствующие в целевом типе, помогая обнаружить опечатки в ключах.
type Config = { mode: string };
// const c = { mode: "dark", extar: true } satisfies Config; // Error: extar
const c = { mode: "dark" } satisfies Config;
console.log(c.mode);Сохранение кортежной структуры
satisfies также помогает массивам сохранять точность, свойственную кортежам, в сочетании с as const, одновременно проверяя типы элементов.
type Nums = readonly number[];
const xs = [1, 2, 3] as const satisfies Nums;
// xs is a readonly tuple [1, 2, 3], validated as numbers
console.log(xs.length);Аннотация расширяет члены объединения
Если поле представляет собой объединение, например "a" | "b", аннотация с типом-объединением сохраняет его как объединение, но более широкий тип поля расширяет его. satisfies фиксирует точный член объединения.
type Config = { tier: string };
const withAnn: Config = { tier: "pro" }; // tier: string
const withSat = { tier: "pro" } satisfies Config; // tier: "pro"
console.log(withAnn.tier, withSat.tier);Автодополнение сохраняется при чтении
Поскольку satisfies сохраняет литеральные ключи и значения, редакторы могут предлагать автодополнение на основе точного объекта, а не более широкого объявленного типа.
type Theme = Record<string, string>;
const theme = { bg: "black", fg: "white" } satisfies Theme;
// theme.<autocomplete shows bg and fg>
console.log(theme.bg, theme.fg);Как выбрать подход
Используйте обычную аннотацию, когда Вам действительно нужен более широкий тип. Используйте satisfies, когда нужна проверка, но также требуется сохранить точную выведенную структуру.
type Config = { mode: string };
// Want wide type for reassignment flexibility -> annotation
let a: Config = { mode: "dark" };
// Want exact literals for later indexing -> satisfies
const b = { mode: "dark" } satisfies Config;
console.log(a.mode, b.mode);Сводка бок о бок
Аннотация расширяет тип, а satisfies сохраняет его. Оба подхода выполняют проверку. Для неизменяемых конфигураций, из которых Вы читаете данные, satisfies обычно является лучшим вариантом по умолчанию.
type C = { color: string; size: number };
const widened: C = { color: "red", size: 1 };
const exact = { color: "red", size: 1 } satisfies C;
console.log(widened.color, exact.color);Быстрая проверка: satisfies и аннотация
Проверьте, понимаете ли Вы различие между этими подходами.
Итоги: satisfies и аннотация типа
Аннотация типа проверяет значения, но расширяет литералы до их базовых типов. Оператор satisfies выполняет проверку и сохраняет точное выведение типов, включая литеральные значения, ключи и точность кортежей.
type C = { mode: string };
const c = { mode: "dark" } satisfies C;
const exact: "dark" = c.mode;
console.log(exact);
Изучай TypeScript с ИИ-репетитором — бесплатно
Пиши и запускай код прямо в браузере, получай мгновенную помощь от ИИ-репетитора 24/7 и продолжи учиться на сайте или в приложении.
- Курсы
- 101
- Уроки
- 352
Часто задаваемые вопросы
Урок «satisfies и аннотация типа» бесплатный?
Да — полный текст урока «satisfies и аннотация типа» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс TypeScript Academy, подпишись на CoddyKit PRO. Курс TypeScript Academy содержит 4 уроков всего.
Чему я научусь в уроке «satisfies и аннотация типа»?
Сохраняйте вывод литеральных типов и одновременно проверяйте структуру Ты практикуешь TypeScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать TypeScript Academy?
Предыдущий опыт не требуется. TypeScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 4.
Сколько времени занимает урок «satisfies и аннотация типа»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке TypeScript Academy?
Да. Каждый урок TypeScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Зачем нужен satisfies
- satisfies и аннотация типа
- satisfies и утверждение as
- Практические шаблоны satisfies