useStateの型、Dispatch<SetStateAction<T>> についてとジェネリック型
useStateの型 useStateの状態管理関数をPropsで渡すとき、受け取る側は Dispatch<SetStateAction<T>>; という方で受け取ることになる。 ジェネリクスのメリットがいまいち 関係ないけどずっと気になっていた「ジェネリクスのメリットがいまいちピンとこない件」について、ついでに調べてみることにした。 例えば、 // 文字列を入力し、文字列を出力する関数 const returnText = (input: string): string => { return input; }; // 数値を入力し、数値を出力する関数 const returnNumber = (input: number): number => { return input; }; console.log(returnText("hello world"), "returnText"); console.log(returnNumber(0), "returnNumber"); という関数が存在した時、 const returnTextOrNumber = (input: string | number): string | number => { return input; }; console.log(returnTextOrNumber("hello world"), "returnTextOrNumber"); console.log(returnTextOrNumber(0), "returnTextOrNumber"); こんな感じにまとめたくなる。 これをジェネリック型にすると、 const returnTextOrNumberGeneric = <T extends string | number>(input: T): T => { return input; }; こんな感じになる。...