TypeScript入門関数式とアロー関数で関数を作ろう

記事を共有：

関数を宣言するとき、次のような書式で記述しました。

function add1(a: number, b: number): number {
  return a + b;
}
console.log(add1(1, 2));

パラメータとして渡された2つの数字を、足し算して返すだけの簡単な関数ですが、この関数の宣言方法を「関数宣言」と呼びます。JavaScriptの初期の頃から利用されている宣言方法ですが、TypeScript（や近年のJavaScript）では、より簡単な書き方が可能になっています。

関数式

関数式は、定数の宣言と同じような書式で記述することができる方法です。次のように変更しましょう。

// function04.ts
const add2 = function(a: number, b: number): number {
  return a + b;
}
console.log(add2(3, 4));

これでも同じように動作します。ここでは、7が表示されます。

関数式は、この後紹介するアロー関数との間に使われていた方法で、現在ではあまり使う機会は多くありません。

アロー関数は、関数の宣言の中で、最も短く書くことができる方法です。次のようになります。

const add3 = (a: number, b: number): number => a + b;
console.log(add3(5, 6));

決まり文句がほとんどなくなって、かなり簡単に記述できるようになったことが分かります。次のような書式になります。

const 関数名 = (パラメータの定義) => 戻り値

なお、複数行の処理が必要な場合などは中括弧を使って、次のように記述することもできます。その場合は、「return」は省略できませんので注意しましょう。

const add_tax = (price) => {
  const intax = Math.round(price * 1.1);
  return intax;
}

このように、さまざまな書き方がある関数の宣言ですが、どれを使ったら良いか迷ったら、関数定義の方法を使うのが確実です。非常にわかりやすいプログラムを作ることができます。慣れてきたら、そのほかの方法なども使っていくと良いでしょう。