【TypeScript】TypeScriptでの3つの関数の書き方

TypeScriptの関数には、3つの書き方が存在する。

①関数宣言を使う方法
②関数式(関数を式を変数に代入する方法)
③アロー関数

以下、各関数の作成方法の詳細。

①関数宣言を使う方法

◆文法
function 関数名 (仮引数1: 仮引数の型, 仮引数2:仮引数の型): 戻り値のデータ型 {
処理の記述
};

◆呼び出し方
var 変数名: 変数の型 = 関数名(実引数1, 実引数2);

//関数宣言を使う方法

//関数の宣言を行う
function hello (a: string, b: string ):string {
    return a + b;
};

//関数を呼び出して変数を代入
var aisatsu: string = hello("Hello,","Sekky!");

window.alert(aisatsu);

②関数式(関数を式を変数に代入する方法)

◆文法
var 変数 = function 関数名 (仮引数1: 仮引数の型, 仮引数2:仮引数の型) : 戻り値のデータ型{
処理の記述
};

//関数式(関数を式を変数に代入する方法)

//右辺で関数を作成し、左辺の変数に代入する
var aisatsu = function (a: string, b:string): string {
    return a + b;
};

//変数に代入した関数の利用
window.alert(aisatsu("Hello,","Sekky!"));

③アロー関数

◆文法
(1)通常の書き方
var 変数 =(仮引数1: 仮引数の型, 仮引数2:仮引数の型): 戻り値のデータ型=> {
処理の記述
};

(2)簡略版
var 変数 =(仮引数1: 仮引数の型, 仮引数2:仮引数の型): 戻り値のデータ型=> 処理の記述

//アロー関数の作成

//右辺でアロー関数を宣言し、左辺の変数に代入する
var aisatsu = (a: string, b: string): string => {
    return a + b;
};
/* 上記のアロー関数は、以下の書き方でも可能
var aisatsu = (a: string, b: string): string => a + b;
この簡略版のアロー関数なら、returnは不要
*/

//変数に代入した関数の利用
window.alert(aisatsu("Hello,", "Sekky!"));

参考にさせていただいたサイト

羽山博(2015)「ITmedia TypeScriptで学ぶJavaScript入門:第10回 関数の基本的な取り扱い方」
」, <http://www.ne.jp/asahi/coffee/house/ARG/compass-028.html TypeScriptで学ぶJavaScript入門:第10回 関数の基本的な取り扱い方 (1/5) - @IT >

2016年8月27日アクセス.