前回は、TypeScript の関数の型について紹介しました。

今回は、前回作成した関数を、新たな変数に使用したい場合について紹介します。

前回のコードは、こちらです。

function calculation(number1: number, number2: number): number {
  return number1 + number2
}

calculation(1, 2)

新たにresolutionという変数を作成したとします。

この変数にcalculation関数を入れます。

let resolution

resolution = calculation

一度、console.log(resolution(1, 2));で見てみます。

image2

1+2=3 として結果が返ってきました。

さらに resolution に 1 と 2 の文字列を入れてみます。

let resolution

resolution = calculation
resolution = "1" + "2"

image3

resolution 変数にエラーが発生していません。

console.log(resolution);で確認すると、

image4

12 と結果が返ってきています。

これは、resolution変数が any 型だからです。

このような結果が出ないようにするためにします。

一つは、resolution変数は、Function 型だと指定します。

let resolution: Function

そうすることにより、resolutionは関数だと宣言できるようになります。

image5

resolution変数にcalculation関数を入れてもエラーになりませんが、文字列の値を入れるとエラーになりました。

image6

calculation関数と同様に、resolustion変数は、number 型と number 型の計算をするということをを指定したい場合は、以下のように行います。

let resolution: (a: number, b: number) => number

これで、resolustion変数は、number 型と number 型のパラメータを使って、number 型を返しますよ、と宣言することができました。

文字列通しを足し算するcalculation2関数を作って、resolution変数に入れてみます。

function calculation(number1: number, number2: number): number {
  return number1 + number2
}

function calculation2(character1: string, character2: string): string {
  return character1 + character2
}

calculation(1, 2)

let resolution: (a: number, b: number) => number

resolution = calculation
resolution = calculation2

image7

『型 '(character1: string, character2: string) => string' を型 '(a: number, b: number) => number' に割り当てることはできません。』と指摘されました。

ブログ一覧