【TypeScript】インデックスシグネチャのオブジェクトで存在しないキーを指定した時の動作

概要

インデックスシグネチャはこちらの記事にある通り、型のプロパティを動的に設定する場合に用いるものです。いわゆる連想配列のような使い方をする場合に、用いるものになります。
値を取り出すときはキーを指定するのですが、その際に存在しないキーで取り出そうとしたら、どのような動作をするかのメモ書きをします。

コード例

例えば以下のコードがあるとします。

type SampleType = {
  [key: string]: number;
};

const objectKeyMain = () => {
  const sampleType: SampleType = {
    test1: 1,
    test2: 2,
    test3: 3,
  };
  // 「test1」は存在するので「1」が取得できる
  const sample1 = sampleType["test1"];
  console.log(sample1);
  // 「test4」は存在しないがどうなるか
  const sample4 = sampleType["test4"];
  console.log(sample4);
};

objectKeyMain();

valueの型はnumberですが、これで存在しないキーが指定されたsample4の値はどうなるか。

結果

undefinedになります。そりゃそうだよねという話なのですが、型はnumber型なのにundefinedになるのは、少し気持ち悪いですよね。
もし存在しないキーが指定されうる場合は、サバイバルTypeScriptのインデックス型 (index signature)の解説にある、コンパイラーオプションnoUncheckedIndexedAccessの有効化も対応案の一つです。このオプションを有効化すると、インデックスシグネチャのオブジェクトから取得した値は、指定した型とundefinedのユニオン型になります。