TypeScript ブランケット記法でインデックスシグネチャエラー
はじめに
オブジェクトのプロパティにアクセスする際にブランケット記法を使うと、
動的なキーを使用してアクセスすることができます。
ただAPIからのレスポンスに対してプロパティにアクセスしたいという場面で
No index signature
エラーがでてしまいハマったので対応をまとめてみます。
インデックスシグネチャとは
オブジェクトがどのようなキーをとるかを示すための型アノテーションです。
{[key: T]: U}
のように指定をします。
このオブジェクトは型Tのすべてのキーは、型Uの値を持たなければいけない、という意味になります。
また、型Tにはnumberかstring型のどちらかが使用できます。
やりたいこと
構造がわからないオブジェクトに対して、任意のキーを使用してプロパティにアクセスする、が今回のやりたいことです。
イメージとしては下記のように任意のオブジェクトとキーでアクセスしようとするとコンパイルエラーがでてしまいます。
const returnPersonData = (obj: object, key: string): any => {
console.log(obj[key]);
};
型 'string' の式を使用して型 '{}' にインデックスを付けることはできないため、要素は暗黙的に 'any' 型になります。
型 'string' のパラメーターを持つインデックス シグネチャが型 '{}' に見つかりませんでした。
obj
に対してkey
が存在するかどうかTypeScriptはわからないため、エラーとなってしまっています。
やったこと
objの型に{[key: T]: U}
を指定するようにしました。
const returnPersonData = (obj: {[anyKey: string]: any}, key: string): any => {
今回オブジェクトの構造がまったく予測できないため、anyを使用しました。
型安全面から見てanyは使いたくないのですが見つからなかったためこちらの方法にしました。
(anyの替わりにstring | number | boolean | object
も使えますがそこまで絞り込めない且つ冗長なのでanyにしました。)
まとめ
他の方法がありそうな気はします...
他に良い方法ないか調べてみます。
参考
Author And Source
この問題について(TypeScript ブランケット記法でインデックスシグネチャエラー), 我々は、より多くの情報をここで見つけました https://zenn.dev/yyya/articles/a60e54f0582b41著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Collection and Share based on the CC protocol