libro
www.tuyano.com
初心者のためのTypeScript入門

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

作成:2016-04-29 09:40
更新:2016-04-29 09:40

■引数と返値の基本

TypeScriptの関数は、基本的な部分はJavaScriptと同じです。functionキーワードを使い、関数名と引数を記述して定義をします。
function 関数名 ( 変数, 変数, …… ){
    ……実行する処理……
}

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

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

このように、引数として指定する変数名の後に、「: タイプ」という形でその変数のタイプを指定できます。――更には、返値のタイプも指定することができます。
function 関数名 ( 変数 : タイプ , 変数 : タイプ, ……) : タイプ {……
}
このように、引数の()の後に「: タイプ」という形で返値のタイプを指定することができるのです。これで、やりとりする値のタイプをきっちりと指定して関数を定義できるようになります。

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

※プログラムリストが表示されない場合

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());
※関連コンテンツ

「初心者のためのTypeScript入門」に戻る