TypeScriptの型 備忘録

型の指定の仕方

• 型注釈
  明示的に指定する方法
• 型推論
  値によって型を自動的に指定する

基本的には型推論、型推論が効かない時は型注釈

• boolean型

• true

• false

• number型

• 整数

• 少数

• 負の数

• string型

• シングルクオート

• ダブルクオート

• バッククオート

• object 型

const person: {
   name: string;
   age: number;
}

• array型

const fruits: string[] = ['Apple', 'Banana', 'Grape']

• Tuple型
• 配列の１つ目がstring、2つ目がnumber、3つ目がbooleanなど配列の中身まで詳しく指定したい時などに使う

const book: [string, number, boolean] = ['business', 1200, false]

• Enum型
  • 複数の決まった値しか入らない場合等に使用する

enum CoffeeSize = {
  SHORT,
  TALL,
  GRANDE,
  VENTI
}
const coffee = {
  hot: true,
  size: CoffeeSize.TALL
}
coffee.size = CoffeeSize.SHORT

• any型

• どんな型でも入る型

• 基本的には使わないようにする

• Union型

  • 複数の型の指定ができる

let unionType: number | string = 10;
let unionTyoes (number | string)[] = [21, 'hello'];

• Literal型
  • 決まった値しか入らない型
  • const にすることでLiteral型に型推論される

const apple: 'apple' = 'appel';
let clothSize: 'small' | 'medium' | 'large' = 'large';

• typeエイリアス
  • 新たな名前で型自体を定義する

 type ClothSize: 'small' | 'medium' | 'large';

• 関数宣言時の型
• 関数はパラメータと戻り値に型を定義する
• パラメータには型推論が効かない、戻り値には型推論が効く
• 基本的にパラメータ、戻り値両方に型注釈する

 function add(num1: number, num2: number): number {
   return num1 + num2
 }

• void型

• 何も返さない型

• undefind型とnull型

• どちらにもundefind と nullを入れることができる

• 特定の関数を代入する変数宣言時の型

function add(num1: number, num2: number): number {
  return num1 + num2
}
const anotherAdd: (n1: number, n2:number) => number = add;

• callback関数の型

 function doubleAndHandle(num: number, cb: (num: number) => number): void {
   const doubleNum = cb (num * 2);
 }
 doubleAndHandle(21, doubleNum => {
   return doubleNum
 });

• unknown型

• anyと似ていてどんな値も入れることができる

• anyとの違いはunknown型の値を使うときに同じ型の値にしか入れることができない

• never型

• voidと違いundefindも返さないときに使用できる

function error(message: string): never {
  throw new Error(message);
}

• インターセクション型

type Enginner = {
  name:string;
  role: string;
}
type Blogger = {
  name:string;
  follower: string;
}
type EngineerBlogger = Engineer & Blogger;
interface EngineerBlogger extends Engineer, Blogger {};

const quill: EngineerBlogger = {
  name: 'sam',
  role: 'front-end',
  follower: 1000
}

type NumberBoolean = number | boolean;
type StringNumber = string | number;
type Mix = NumberBoolean & StringNumber;
## Mixはnumber型になる