関数をマスターする (1/5)

TypeScriptの関数は、基本的な部分はJavaScriptと同じです。functionキーワードを使い、関数名と引数を記述して定義をします。

function 関数名 ( 変数, 変数, …… ){
    ……実行する処理……
}

引数を複数指定する場合は、変数名をカンマで区切って記述しましたね。ここまでは、TypeScriptでもまったく同じです。

この基本形をもとに、TypeScriptでは、更にいろいろと拡張がされています。まず頭に入れておきたいのは、「値のタイプ」の指定です。TypeScriptでは、変数を宣言するときにタイプを指定できましたが、関数の引数でも同様にタイプを指定することができます。

function 関数名 ( 変数 : タイプ , 変数 : タイプ, ……){……}

このように、引数として指定する変数名の後に、「: タイプ」という形でその変数のタイプを指定できます。――更には、返値のタイプも指定することができます。

function 関数名 ( 変数 : タイプ , 変数 : タイプ, ……) : タイプ {……

}
このように、引数の()の後に「: タイプ」という形で返値のタイプを指定することができるのです。これで、やりとりする値のタイプをきっちりと指定して関数を定義できるようになります。

では、簡単な利用例を下に掲載しておきましょう。整数値を引数として渡すと、１からその数字までの合計を計算して返す関数calcを作ってみました。ここでは、「function calc(n:number):number」というように宣言をしています。number型の引数が１つあり、返値もnumber型の値であることがわかりますね。

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

function calc(n:number):number {
    let total:number = 0;
    for(var i:number = 1;i <= n;i++){
        total += i;
    }
    return total;
}

let num:number = calc(123);
document.write(num.toString());