2024-09-17

基本の関数構文

関数宣言

code:関数宣言

function 関数名 (引数) {

// 処理

}

関数式

code:関数式：変数に代入する

const 変数名 = function (引数) {

// 処理

}

code:関数式：関数名の省略(無名関数)

const 件数名 = function () {

// 処理

}

件数名();

code:関数式：オブジェクトのプロパティに代入

const オブジェクト = {

メソッド名: function () {}

}

関数の型注釈・型推論

code:関数の型注釈の構文

function 関数名(引数名: 型): 戻り値の型 {

return 戻り値;

}

戻り値の型注釈を省略した場合はreturn文によって推論される

関数型（型エイリアスで作った関数の型）の変数に関数式を代入する場合は型注釈を省略しても変数の型情報から型推論される

code:変数に関数型が指定されている場合

type CallbackFunction = (value: string) => boolean; // 引数のvalueの型がstring、戻り値の型がbooleanの関数型を定義

let CallbackFunction: CallbackFunction; // 関数型の変数

CallbackFunction = function (value) {

return value.length > 5;

};

参考：

関数の引数

引数の省略

➜オプショナル引数は引数を省略して関数を呼び出すことができる

関数内にオプショナルな引数が省略された場合のコードを組み込んでおく必要がある

code:オプショナル引数に使用例

function hello(name: string, title?: string): void {

// オプショナル引数は必須引数の後に配置

if (title) {

} else {

}

}

hello("山田太郎"); // "Hello, 山田太郎!"

hello("山田太郎", "さん"); // "Hello, 山田太郎 さん!"

引数のデフォルト値

関数の定義時に引数にデフォルトの値を設定することができる

➜引数のデフォルト値を設定することで引数を省略して関数を呼び出すことができる

code:デフォルト値を設定した引数の使用例

function greet(name: string, title = "さん"): void {

}

greet("山田太郎"); // "Hello, 山田太郎 さん!"

greet("山田太郎", "様"); // "Hello, 山田太郎 様!"

可変長引数

可変長引数とは、引数の数が固定されていない時、任意の数の引数を受け取ることができる機能

また、可変長引数は配列として扱われる

可変長引数は関数の最後の引数として配置する必要がある

code:可変長引数の使用例

function sum(...numbers: number[]): number {

return numbers.reduce(function (total, num) {

return total + num;

});

}

console.log(sum(1, 2, 3)); // 6

可変長引数は関数内では配列として扱われるが、渡す時には配列で渡すとエラーになる（スプレッド構文を使用すればエラーにならない）

code:配列では渡せない

//console.log(sum(numbers)); // error: Argument of type 'number[]' is not assignable to parameter of type 'number'.

console.log(sum(...numbers)); // 6

型エイリアス

➜複雑な型を簡潔に表現したり、再利用可能な型を定義できる

code:型エイリアスの例（ユニオン型）

type StringOrNumber = string | number;

let test: StringOrNumber = 123;

test = 123; // OK

test = "test"; //OK

code:型エイリアスの例（関数型）

type CallbackFunction = (value: string) => boolean;