Typescriptでの関数の宣言方法

スポンサーリンク

はじめに

Typescriptでの関数宣言方法についてまとめてみます。

関数宣言

基本的には、引数には型を明示的に指定し、戻り値はTypescriptが型を推論してくれるので明示的に指定する必要はありません。(戻り値に明示的に指定することも可能です)

名前付き関数

名前付き関数の定義は下記の通りです。

function 関数名(引数: 型) {
  return 戻り値
}
function add(a: number, b: number) {
  return a + b
}

オブジェクトを引数にとるときは下記のようになります。

function add({a, b}: {a: number, b: number}) {
  return a + b
}

また、戻り値を明示的に指定すると下記のようになります。

function add(a: number, b: number): number {
  return a + b
}

関数式

関数式の定義は下記の通りです。

const 関数名 = function(引数: 型) {
  return 戻り値
}
const add = function(a: number, b: number) {
  return a + b
}

アロー関数式

アロー関数式の定義は下記の通りです。

const 関数名 = (引数: 型) => {
  return 戻り値
}
const add = (a: number, b: number) => {
  return a + b
}

アロー関数式の省略

関数内のコードが式1つだけの場合は、returnを省略できます。

const 関数名 = (引数: 型) => 戻り値
const add = (a: number, b: number) => a + b

パラメーター

関数のパラメーター(引数)に関しても、いくつか書き方があります。

オプションパラメーター

?をつけることで、省略可能なパラメーターを指定できます。

function add(a: number, b: number, c?: number) {
  console.log(c)
  return a + b
}

デフォルトパラメーター

デフォルトの値を指定することで、省略可能かつ省略された場合のデフォルトの値を指定できます。

function add(a: number, b: number, c = 0) {
  return a + b
}

レストパラメーター

下記のように...をつけることで任意の数のパラメーターを受け付けることができるようになります。

function sum(...numbers: number[]) {
  return numbers.reduce((total, n) => total + n, 0)
}

参考

タイトルとURLをコピーしました