Typescript で複合型を扱うときについてです。

Question

現在Nuxt + typescript の開発をしていて以下のような方のオブジェクトがあります。

export type Props = {
  [key: string]: string | string[] | number | number[]
}

string | string[] | number | number[] のどのタイプとも取りうる値なのでこのようになっているのですが、それぞれを使用する際例えば (arg:string) => {}のような関数に引数としてtype Props の値を渡す際は常に改めてstringにキャストしなければなりません。これはどうする事もできない？のでしょうか？

こういった場合ベストな設計などあるのでしょうか？

ご教授いただけると幸いです。

Comments

[hoshi-takanori]

TypeScript のキャスト (〜 as string) は実際の値はそのままで TypeScript の型システムを素通しするだけなので、string 以外の値が入る可能性があるなら動的に値をチェックしたり、toString メソッドなどで型変換する必要があるかと。
https://stackoverflow.com/questions/47664576/as-string-versus-tostring

Answer 1

string | string[] | number | number[] のどのタイプとも取りうる値なのでこのようになっているのですが

本当に、「任意のキー」に対して4つの型をいずれもとりうる状況なのでしょうか？

「特定のキーは特定の型になる」とわかっている状況なら、foo: stringのように限定することも可能です。

Comments

[Hayato1201]

>「任意のキー」に対して4つの型をいずれもとりうる状況
はい、仕組み上汎用的なパラメータを入れる型なので任意のキーになってしまっています。

[maisumakun]

でしたら、キャストなど、適当な手段でstringになることを明示する必要があります。