【TypeScript】satisfies演算子

に公開

そんなのあったんだーと最近知ったsatisfies演算子について。

satisfiesって何?

satisfies は「ある値が特定の型を満たしているかチェックする」ための演算子です。
TypeScript4.9で導入されました。(3年前か...)
https://devblogs.microsoft.com/typescript/announcing-typescript-4-9-beta/#the-satisfies-operator

const array1: (string | number)[] = [1, 2, 3];
const array2 = [1, 2, 3] satisfies (string | number)[];

array1 は型注釈があるので、各要素の型は (string | number)。
array2 は satisfies によって [1, 2, 3] が (string | number)[] を満たしているかをチェックしているだけ。型は number[] のまま保持されます。

このように、satisfies を使うことで、型注釈なしでなるべく狭い型を保ちつつ、型の安全性をチェックできるというのがメリットです。

実務での利用例

オブジェクトのプロパティ型保持

type Colors = 'red' | 'green' | 'blue';

// 従来の型注釈:プロパティの型が広くなってしまう
const palette1: Record<string, Colors> = {
  primary: 'red',    // Colors型
  secondary: 'blue'  // Colors型
};

// satisfiesを使用:具体的な値の型を保持
const palette2 = {
  primary: 'red',    // 'red'型(リテラル型)
  secondary: 'blue'  // 'blue'型(リテラル型)
} satisfies Record<string, Colors>;

// palette2.primaryは'red'型なので、より厳密な型チェックが可能
if (palette2.primary === 'red') {
  // この分岐では型が確定している
}

設定オブジェクトの検証

type Config = {
  apiUrl: string;
  timeout: number;
  retries?: number;
  features: {
    enableLogging: boolean;
    enableCache: boolean;
  };
};

const config = {
  apiUrl: 'https://api.example.com',
  timeout: 5000,
  features: {
    enableLogging: true,
    enableCache: false
  }
} satisfies Config;

// configの型は推論された型のまま

まとめ

安全に型チェックしたい。でも型の推論を失いたくないときに使いましょう。

参考

https://typescriptbook.jp/reference/values-types-variables/satisfies

NCDCエンジニアブログ

Discussion