ユーザー定義関数
関数とは、何かしらの粗利を1つにまとめて、後から関数名という名前で呼び出せるようにしたものです。以前の記事で触れました。文字列を数値に変換する「Number」など、javaScriptには、たくさんの関数が用意されています。
今回は、javaScriptで予め用意されている関数ではなく、自作したオリジナルの関数(ユーザー定義関数)を作成する方法を記載していきます。
よく使う処理を関数にすることで、後から何度でも好きな時に呼び出すことができます。
今回の例としては、「ユーロ」と為替レートという2つの数値を引数として受け取り、円に換算する関数「euroToYen」を書いていきます。
サンプルコードの実行結果はこちら
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
<!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> |
関数定義の書き方
関数という言葉は英語の「function」からきています。functionというキーワードを使い、次のような書き方をして、関数を定義します。
1 2 3 4 |
function 関数名(引数1,引数2, ...){ <実際の処理を書く> return 戻り値; } |
引数の数は、関数が行う処理によって違います。引数が複数ある場合は、カンマ「,」で区切ります。「{」「}」で囲まれたブロック内に記述します。ブロック内にあるreturn文では、関数が行った処理の結果である戻り値を
指定します。return文が実行されると、呼び出した側に「戻り値」が戻され関数ブロックから脱出します。
関数の呼び出し
関数を呼び出す時は「関数名(引数1,引数2,...)」という具合に書きます。関数を定義するときに書く引数を仮引数、呼び出す時に記述する引数を実引数といいます。関数を呼び出したとき実引数が仮引数に代入されます。
1 2 3 4 |
//10と134の部分は実引数 var yen1 = euroToYen(10,134); //euroとrateは仮引数 function euroToYen(euro,rate){} |