TypeScriptの型

TypeScript

boolean,number,string

let value: boolean = false;
let count: number = 0;
let inputText:string = 'hello';

オブジェクト

const person: {
    name: string,
    age: number
} = {
    name: 'Sadako',
    age: 25
}

配列

const Vegetable: string[] = ['Potato','Carrot','Eggplant'];

Tuple型

異なる型を順番に持つ配列を表現します。

const book: [string, number, boolean] = ['philosophy', 2000, false];

Enum型

enum Direction {
  Up = 1,
  Down,
  Left,
  Right
}
let dir: Direction = Direction.Up;

Union型

let box: number | string = 10;

配列でもUnion型を使用できます。

let boxFunction:(number | string)[] = [6, 'こんにちは'];

Literal型

const orange = 'orange';
let shoesSize: 'small' | 'medium' | 'large' = 'small';

typeエイリアス

type ShoesSize = 'small' | 'medium' | 'large';
let shoesSize: ShoesSize = 'large';

typeエイリアスはjavascriptでは表示されない

関数宣言に型をつける

パラメータには型を定義

戻り値(パラメータの型の後ろにコロンをつけて定義)は型推論でもOK

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

関数式に型をつける

戻り値は=>で表します。

const caliculateA :(n1: number, n2: number) => number = caliculate;

void型

返り値がない場合に書きます。

function sayGoodbye(): void {
 console.log('bye');
}

unknown型

型が不明な場合に使いますが、anyよりも安全です。unknown型の値を操作する前に型チェックが必要です。

let value: unknown = 5;
if (typeof value === 'number') {
  console.log(value + 1);
}

never型

値を何も返さない

type Animal = 'dog' | 'cat';

function sound(animal: Animal) {
  switch (animal) {
    case 'dog':
      return 'wan wan';
    case 'cat':
      return 'nyan nyan';
    default:
      // `animal`は絶対に'dog'か'cat'なので、ここに来ることはないはず
      const _exhaustiveCheck: never = animal;
      return _exhaustiveCheck;
  }
}

アロー関数に型をつける

const doubleNumber = num(num: number) => num * 2

または

const doubleNumber: (num: number) => number = num => num * 2;

コールバック関数に型をつける

function doMath(
  a: number,
  b: number,
  callback: (x: number, y: number) => number
): number {
  return callback(a, b);
}