TypeScriptの関数型

概要: このチュートリアルでは、関数の型を定義できるTypeScriptの関数型について学びます。

TypeScriptの関数型入門

関数型には、パラメータと戻り値の型の2つの部分があります。関数型を宣言するときは、次の構文で両方の部分を指定する必要があります。

(parameter: type, parameter:type,...) => typeCode language: PHP (php)

次の例は、2つの数値を受け取り、数値を返す関数型を持つ変数を宣言する方法を示しています。

let add: (x: number, y: number) => number;Code language: JavaScript (javascript)

この例では

  • 関数型は、型がnumberであるxyの2つの引数を受け入れます。
  • 戻り値の型は、パラメータと戻り値の型の間に表示される太い矢印(=>)の後に続くnumberです。

パラメータ名(xy)は、読みやすくするためのものです。パラメータの型が一致する限り、それは関数の有効な型です。

変数に関数型をアノテーションすると、同じ型の関数をその変数に代入できます。

TypeScriptコンパイラは、パラメータの数とその型、および戻り値の型を照合します。

次の例は、関数をadd変数に代入する方法を示しています。

add = function (x: number, y: number) {
    return x + y;
};Code language: JavaScript (javascript)

また、次のように変数と関数を変数に代入することもできます。

let add: (a: number, b: number) => number =
    function (x: number, y: number) {
        return x + y;
    };Code language: JavaScript (javascript)

この構文では

  • addは変数です。
  • (a: number, b: number) => numberは関数型です。
  • 残りは、add変数に代入される関数です。

型がadd変数と一致しない他の関数を代入すると、TypeScriptはエラーを発行します。

add = function (x: string, y: string): number {
    return x.concat(y).length;
};Code language: JavaScript (javascript)

この例では、型が一致しない関数をadd関数変数に再代入しました。

関数型の推論

方程式の片側に型がある場合、TypeScriptコンパイラは関数型を判断できます。この形式の型推論は、コンテキスト型付けと呼ばれます。例:

この例では、add関数は型(x: number, y:number) => numberを取ります。

型推論を使用することで、アノテーション付きのコード量を大幅に削減できます。

このチュートリアルは役に立ちましたか?