まずは関数の型から
const Index = ({ }:引数の型):返り値の型 => {
return (
ここが返り値で引数を使ったりもする
)
}
次は変数宣言の型
let Index:変数の型 = x
返り値の型はReact系列だとvoidかJSX.Elementを明示的に付けるくらいしかない。
引数の型はType Propsでゴリゴリ付けることになる。
変数の型はそのまま型を入れるだけ。
##通常の型
数字:number
文字列:string
条件分岐:boolean
##ボトム型
- 何もない=利用できない:null
- 関数は動くけど返り値を返さない:void
- そもそも値を持たない:never
- 初期化されていない:undefined
正直ボトムは全部知らなくていいし覚えなくていいと思う。
それで簡単なことを当然のようにやらなければ凄いこともできない。
Next.jsの特殊型で言うと
- GetStaticProps(記事一覧表示取得のimportで付ける型)
- GetStaticPaths(記事ページ表示のimportで付ける型)
需要のあるmapメソッドの型は
・map:StringConstructor
useStateで使う型は
・React.Dispatch>
型がanyとか入ってなかったりするとESLintやサーバーがゲロ警告吐きまくる。
今までJavaScriptはぐちゃぐちゃのスライムみたいなイメージだったがTypeScriptは箱みたいなイメージだ。
依存関係の環境で型検査の厳格強度も変わるので全ての環境が一致すると断言できない。