やったこと
【世界で7万人が受講】Understanding TypeScript 日本語版
学んだこと
Union型
「AまたはBの型」といった表現が可能になる。
const combine = (input1:number | string, input2:number | string):number | string => {...}
Literal 型
「特定の値を持ったオブジェクトのみ有効」といった表現が可能
const combine = (
input1: number | string,
input2: number | string,
resultConversion: 'as-number' | 'as-string'
): number | string => {...}
上記の ResultConversion は、String型の内、 as-number と as-string という値のみ引き受ける。
これで、任意のstring型がやってくる可能性を排除できる。
alias型
type キーワードを使用した、任意の型を定義できる機能。
型定義に新たな名前を付与でき、再利用性を高める。
type addNumber = (n1: number, n2: number) => number; /*関数の型*/
type Combinable = number | string; /*Union型*/
type ResultConversion = 'as-number' | 'as-string'; /*Literal型*/
type TodoType = { /* Object型 */
userId:number;
id: number;
title: string;
completed: boolean;
}
typeで定義した型は、 export することで、ファイル分割された他のソースコードから参照できる。
Pick と Omit の復習
既存のオブジェクトから任意のフィールドを抜き出し、新たなオブジェクトを定義する記法。
export type TodoType = {
userId: number;
id: number;
title: string;
completed: boolean
}
...
const Todo = (props: Omit<TodoType, "id">) => {...}
const Todo = (props: Pick<TodoType, "userId","title","completed">) => {...}
any型よりもunknown型
unknown型の変数を他の型(例えばstring)の変数へ代入するには、型チェックしなければならない(コンパイルエラーが発生する)。
any型で同様のことを実施すると、コンパイルエラーが発生しない。
コンパイルエラーを発生させ、プログラマに注意を促す意味で、unkown型の方が推奨される。