処理をまとめて、その名前を書くと呼び出せるようにする

ユーザー定義関数
1. 関数定義の書き方
2. 関数の呼び出し

ユーザー定義関数

関数とは、何かしらの粗利を１つにまとめて、後から関数名という名前で呼び出せるようにしたものです。以前の記事で触れました。文字列を数値に変換する「Number」など、javaScriptには、たくさんの関数が用意されています。

今回は、javaScriptで予め用意されている関数ではなく、自作したオリジナルの関数(ユーザー定義関数)を作成する方法を記載していきます。

よく使う処理を関数にすることで、後から何度でも好きな時に呼び出すことができます。
今回の例としては、「ユーロ」と為替レートという２つの数値を引数として受け取り、円に換算する関数「euroToYen」を書いていきます。

サンプルコードの実行結果はこちら

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>関数を作成する</title>
    
<script>
//使用する関数の定義を行います。
//10~14行目が実際の処理を書きます。    
function euroToYen(euro,rate){
    var yen;
    yen = euro * rate;
    return yen;    
}    
</script>
    <style>
    body{
        background-color:aqua;
    }
    </style>
</head>
<body>
    
<script>
    //ユーロ→円に換算した値を変数に入れています。
    var yen1 = euroToYen(10,134);
    document.write( yen1 ,"円<br>");
    
    var euro2 = 50;
    var ChangeRate2 = 135;
    
    //変数を引数に関数を呼び出すことができます。
    yen1 = euroToYen(euro2,ChangeRate2);
    document.write( yen1 ,"円<br>");

</script>
</body>
</html>

<!doctype html>

<html>

<head>

<title>関数を作成する</title>

//使用する関数の定義を行います。

//10~14行目が実際の処理を書きます。

function euroToYen(euro,rate){

var yen;

yen = euro * rate;

return yen;

}

</script>

<style>

body{

background-color:aqua;

}

</style>

</head>

<body>

//ユーロ→円に換算した値を変数に入れています。

var yen1 = euroToYen(10,134);

document.write( yen1 ,"円<br>");

var euro2 = 50;

var ChangeRate2 = 135;

//変数を引数に関数を呼び出すことができます。

yen1 = euroToYen(euro2,ChangeRate2);

document.write( yen1 ,"円<br>");

</script>

</body>

</html>

関数定義の書き方

関数という言葉は英語の「function」からきています。functionというキーワードを使い、次のような書き方をして、関数を定義します。

function 関数名(引数1,引数2, ...){
	&lt;実際の処理を書く&gt;
	return  戻り値;
}

function 関数名(引数1,引数2, ...){

<実際の処理を書く>

return 戻り値;

}

引数の数は、関数が行う処理によって違います。引数が複数ある場合は、カンマ「,」で区切ります。「{」「}」で囲まれたブロック内に記述します。ブロック内にあるreturn文では、関数が行った処理の結果である戻り値を
指定します。return文が実行されると、呼び出した側に「戻り値」が戻され関数ブロックから脱出します。

関数の呼び出し

関数を呼び出す時は「関数名(引数1,引数2,…)」という具合に書きます。関数を定義するときに書く引数を仮引数、呼び出す時に記述する引数を実引数といいます。関数を呼び出したとき実引数が仮引数に代入されます。

//10と134の部分は実引数
    var yen1 = euroToYen(10,134);
	//euroとrateは仮引数
	function euroToYen(euro,rate){}

//10と134の部分は実引数

var yen1 = euroToYen(10,134);

//euroとrateは仮引数

function euroToYen(euro,rate){}