型システムに関する新機能リスト
本連載は、TypeScriptのバージョン3から5.2までのアップデート内容を、テーマごとにバージョン横断で紹介する連載です。第3回である今回紹介するのは、TypeScriptの根幹ともいえる型システムの変更点です。具体的には、以下の内容を順に紹介します。
- ジェネリクスと「...」に関する新機能
- constキーワードに関する新機能
- 型定義におけるテンプレート文字列
- Mapped型での再マッピング
- インデックスシグネチャの新しいキー
- catchブロック変数でunknownが可能
- returnのない関数の戻り値
ジェネリクスと「...」に関する新機能
最初に紹介するのは、ジェネリクスと「...」演算子に関する新機能です。
ジェネリクスとスプレッド演算子の組合せ
例えば、個人情報を表す型定義としてPersonalBaseDataがあり、プロパティとしてid(number型)、name(string型)、phone(string型)があるとします。同様に、id、name、birth(Date型)プロパティが定義されたPersonalBirthDataがあるとします。これらのオブジェクトを、スプレッド演算子を使ってマージするリスト1のような関数を定義したとします。この関数の戻り値は、id、name、phone、birthのプロパティが含まれたオブジェクトとなります。
function mergePersonalData(base: PersonalBaseData, birth: PersonalBirthData) { return {...base, ...birth}; }
このような関数の引数の型を汎用化し、さまざまなオブジェクトに適用できる関数として、リスト2のようなものを考えたとします。
function mergeData<B, E>(base: B, extended: E) { return {...base, ...extended}; }
このmergeData()関数では、リスト1のmergePersonalData()関数と違い、BやEが実行時に指定されるため、そもそもスプレッド演算子で展開できるデータ型かどうかが判定できません。そのため、エラー表示となっていました。それが、バージョン3.2で、エラーとならずに問題なく関数定義ができるように変更されています。
ジェネリクスと残余構文の組合せ
...演算子は、スプレッド演算子以外に残余構文でも利用されます。そのような構文とジェネリクスを組合せたコードとして、リスト3のような関数を考えます。
function extractOtherPersonalProperties<PD extends PersonalBaseData>(personalData: PD) { const {id, name, phone, ...otherProperties} = personalData; return otherProperties; }
このextractOtherPersonalProperties()のジェネリクスで記述されているPersonalBaseDataは、前項のPersonalBaseDataと同じ、すなわち、id、name、phoneの各プロパティが存在するオブジェクトとします。よって、extractOtherPersonalProperties()の引数の型であるPDは、PersonalBaseDataを拡張した型、すなわち、プロパティとしてid、name、phoneが含まれていれば、それ以外には任意のプロパティを含めることができます。
そして、関数内の処理は、引数として渡されたオブジェクトからid、name、phone以外のプロパティのオブジェクトを取り出す処理となっています。その際、...演算子を利用して、引数personalDataのid、name、phone以外が、otherPropertiesに格納されるようにしています。このコードが、以前はエラーとなっていましたが、3.2で問題なく動作するようになりました。