TypeScript Typeof Type Operator 公式ドキュメント
はじめに
TypeScript の typeof 型演算子は、値から型を取得する演算子です。JavaScript の typeof 演算子とは異なり、型コンテキストで使用されます。
TypeScript 公式ドキュメントの内容に基づき、typeof 型演算子の基本概念から制限事項まで、コード例とともに整理しています。
The typeof type operator
JavaScript の typeof との違い
JavaScript には式のコンテキストで使用できる typeof 演算子が既に存在します：
// "string" という文字列を出力
console.log(typeof "Hello world");
TypeScript では、型のコンテキストで変数やプロパティの型を参照するために typeof 演算子を追加しています：
let s = "hello";
let n: typeof s;
// ^? let n: string
ReturnType との組み合わせ
基本的な型には あまり有用ではありませんが、他の型演算子と組み合わせることで typeof を使用して多くのパターンを便利に表現できます。
事前定義された型 ReturnType<T> を例として見てみましょう。これは関数型を受け取り、戻り値の型を生成します：
type Predicate = (x: unknown) => boolean;
type K = ReturnType<Predicate>;
// ^? type K = boolean
関数名での ReturnType の使用
関数名で ReturnType を使用しようとすると、有益なエラーが表示されます：
function f() {
return { x: 10, y: 3 };
}
type P = ReturnType<f>;
// Error: 'f' refers to a value, but is being used as a type here. Did you mean 'typeof f'?
値と型は同じものではないことを覚えておいてください。値 f が持つ型を参照するには、typeof を使用します：
function f() {
return { x: 10, y: 3 };
}
type P = ReturnType<typeof f>;
// ^? type P = {
// x: number;
// y: number;
// }
Limitations
制限事項
TypeScript は意図的に typeof を使用できる式の種類を制限しています。
具体的には、識別子（変数名）またはそのプロパティでのみ typeof を使用することが有効です。これにより、実行されると思っているが実際には実行されないコードを書いてしまう混乱を避けることができます：
// ReturnType<typeof msgbox> を使用するつもり
let shouldContinue: typeof msgbox("Are you sure you want to continue?");
// Error: ',' expected.
この制限により、誤って関数を実行してしまうような記述を防ぐことができます。
まとめ
TypeScript の typeof 型演算子は、値から型を取得するための基本的な型演算子です。
typeof を理解することで、TypeScript の型システムをより効果的に活用できます。特に ReturnType などの他の型演算子と組み合わせることで、動的な型操作が可能になります。
参考リンク
Discussion