TypeScript関数

概要: このチュートリアルでは、TypeScript関数について、そして型注釈を使用して関数の型チェックを強制する方法について学習します。

TypeScript関数の紹介

TypeScript関数は、読みやすく、保守しやすく、再利用可能なコードの構成要素です。

JavaScriptと同様に、TypeScriptではfunctionキーワードを使用して関数を宣言します。

function name(parameter: type, parameter:type,...): returnType {
   // do something
}Code language: JavaScript (javascript)

JavaScriptとは異なり、TypeScriptでは、パラメータに型注釈を使用し、関数の戻り値を指定できます。

以下のadd()関数の例を見てみましょう。

function add(a: number, b: number): number {
    return a + b;
}Code language: TypeScript (typescript)

この例では、add()関数はnumber型の2つのパラメータを受け入れます。

add()関数を呼び出すと、TypeScriptコンパイラは関数に渡された各引数をチェックして、それらが数値であることを確認します。

add()関数の例では、数値のみを渡すことができ、他の型の値は渡せません。

次のコードは、add()関数に2つの数値ではなく2つの文字列を渡しているため、エラーになります。

let sum = add('10', '20');Code language: JavaScript (javascript)

エラー

error TS2345: Argument of type '"10"' is not assignable to parameter of type 'number'Code language: JavaScript (javascript)

関数パラメータの型は、型チェックのために関数本体内でも使用できます。

括弧の後の: numberは戻り値の型を示します。この場合、add()関数はnumber型の値を返します。

関数が戻り値の型を持つ場合、TypeScriptコンパイラはすべてのreturn文を戻り値の型と照合して、戻り値がそれと互換性があることを確認します。

関数が値を返さない場合は、戻り値の型としてvoid型を使用できます。 voidキーワードは、関数が値を返さないことを示します。例えば

function echo(message: string): void {
    console.log(message.toUpperCase());
}Code language: TypeScript (typescript)

voidは、関数内のコードが値を返すのを防ぎ、呼び出し元のコードが関数の結果を変数に代入するのを防ぎます。

戻り値の型に注釈を付けない場合、TypeScriptは適切な型を推論しようとします。例えば

function add(a: number, b: number) {
    return a + b;
}Code language: TypeScript (typescript)

この例では、TypeScriptコンパイラはadd()関数の戻り値の型をnumber型に推論しようとします。これは期待通りの動作です。

ただし、関数が異なる型を返す異なる分岐を持つ場合、TypeScriptコンパイラはユニオン型またはany型を推論する場合があります。

そのため、可能な限り関数に型注釈を追加することが重要です。

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