noUncheckedIndexedAccess を有効にしても配列アクセスでエラーにならなかったので、その現象が起きた際のメモです。
"strict": true を指定する
たとえば、以下のコードでは長さが 2
しかない配列の添字に 5
を指定しているため undefined
となり、その次の行で実行時エラーになってしまいますが、これを TypeScript のエラーとして検知したいわけです。
Hello.tsx
const arr: string[] = ["foo", "bar"];
const item = arr[5];
console.log(item.toUpperCase());
このようなコードを書いた場合、 "strict": true
が指定されていない場合、エラーが発生しません。
以下のように "strict": true
を指定すると、'xxxx' is possibly 'undefined'.
というエラーが発生するようになります。
tsconfig.json
{
"compilerOptions": {
"noUncheckedIndexedAccess": true,
+ "strict": true,
(中略)
},
"include": ["src/**/*"]
}
src/Hello.tsx:31:15 - error TS18048: 'item' is possibly 'undefined'.
31 console.log(item.toUpperCase());
~~~~
これは、"strict": true を指定すると strictNullChecks
が ON になることによる効果かと思われます。
皆さんも noUncheckedIndexedAccess を有効にする際は "strict": true が指定されているかどうかチェックするようにしてみてください。