Typescriptでの関数の宣言方法

2023.07.19
2024.03.24
プログラミング
Typescript

本ページはAmazonアフィリエイトのリンクを含みます。

はじめに

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

関数宣言

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

名前付き関数

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

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

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

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

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

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

関数式

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

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

アロー関数式

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

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

アロー関数式の省略

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

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

パラメーター

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

オプションパラメーター

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

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

デフォルトパラメーター

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

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

レストパラメーター

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

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

参考

Support

\ この記事が役に立ったと思ったら、サポートお願いします! /

buy me a coffee
Share

Profile

author

Masa

都内のIT企業で働くエンジニア
自分が学んだことをブログでわかりやすく発信していきながらスキルアップを目指していきます!

buy me a coffee