LETUNOFF DOCS

TS. Satisfies

🧱 Суть

satisfies – оператор TypeScript, который позволяет проверить, что объект соответствует определённому типу, но при этом не изменяет его собственный тип.

📦 Проблема

Иногда нужно одновременно:

  • проверить структуру объекта
  • сохранить конкретные ключи и значения
  • не потерять автодополнение TypeScript

Например:

const variants = {
  button: {
    default: '...',
    ghost: '...',
  },
  input: {
    default: '...',
    ghost: '...',
  },
};

TypeScript сам понимает точную структуру:

variants.button.default
variants.input.ghost

Но если написать:

const variants: Record<ComponentType, Record<string, string>> = {
	...
};

TypeScript будет считать объект просто:

Record<ComponentType, Record<string, string>>

И потеряет конкретные ключи:

default
ghost

✅ Решение

Использовать satisfies:

const variants = {
	button: {
		default: '...',
		ghost: '...',
	},
	input: {
		default: '...',
		ghost: '...',
	},
} satisfies Record<ComponentType, Record<string, string>>;

💻 Код

TypeScript делает две вещи:

1. Проверяет структуру

Объект должен соответствовать:

Record<ComponentType, Record<string, string>>

Если:

  • нет обязательного поля
  • неправильный тип
  • появились лишние значения
    → TypeScript покажет ошибку.

2. Сохраняет исходный тип

Объект остаётся известным TypeScript:

variants.button.default

а не превращается в:

Record<ComponentType, Record<string, string>>

Отличие от обычной типизации

Обычный тип:

const config: SomeType = {  ...};

Значит: “Считай этот объект именно SomeType”

Минус:

  • теряется часть информации о конкретном объекте
  • меньше подсказок

satisfies

const config = {  ...} satisfies SomeType;

Значит: “Проверь, что объект подходит под SomeType, но оставь настоящий тип”

Плюсы:

  • проверка структуры
  • сохранение ключей
  • лучшее автодополнение

Простая аналогия

Представь шаблон таблицы.

: Type

Ты говоришь: “Приведи мою таблицу к этому шаблону”
И видишь только поля шаблона.

satisfies

Ты говоришь: “Проверь, что моя таблица подходит под шаблон”

Но все оригинальные данные остаются.

🎯 Вывод

  • : Type → задаёт конкретный тип переменной
  • satisfies Type → проверяет соответствие типу
  • satisfies сохраняет точную структуру объекта
  • особенно полезен для:
    • конфигураций
    • variants
    • настроек компонентов
    • словарей
    • дизайн-систем

🔗 Связано

Обратные ссылки