型

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; }; こんな感じになる。...

過去に定義した型から新しい型を生成する TypeScriptで型を定義したのち、その中の一部を使いたくなる時がある。 例えば、Personという型を定義した時、 export interface Person { age: number sex: 'man' | 'woman' bloodType: 'A' | 'B' | 'O' | 'AB' } bloodTypeという型を使用したいという時がある。 そういう時は、 export type BloodType = Person['bloodType'] 上記のように書くことで型を取り出すことができる。 最初から最小で作るの吉？ export interface Age { age: number; } export type Sex = 'man' | 'woman'; export type BloodType = 'A' | 'B' | 'O' | 'AB'; export interface Person { age: Age; sex: Sex; bloodType: BloodType; } そもそも上記のように最小で作っておいた方がいい？ ただ使わないものも多いので、取り出す方が労力が少なく済みそうな気がする。