関数は、同一の処理が複数発生する場合に処理をまとめて記述しておくことで、全体のコード量を減らすことができます(同じような処理を複数記述する必要がない)。引数<SCRIPT LANGUAGE="JavaScript"> <!-- document.write(test_func(20)); function test_func(hikisu) { var atai = 50; return atai*hikisu; } //--> </SCRIPT>function test_func(hikisu)からが、関数の実装部分となります。
関数は function で始まり、その後に関数名を記述します。関数名は何でも構いませんが、数字で始まる名前や、日本語などは使用できません。一つの関数の範囲は { から } までです。function 関数名 (引数) { 処理を記述・・・ return 戻り値; }
関数名 test_func の後の (〜) の部分は引数といい、ここから関数に値を渡すことができます。引数は複数指定することができます(複数指定する場合は,(カンマ)で区切る)。戻り値
引数を渡す必要がない場合は、指定しなくても問題ありません。
<BODY onLoad="test_func(500)"> // 関数 test_func に引数 500 を渡して呼び出す <SCRIPT LANGUAGE="JavaScript"> <!-- function test_func(val) { document.write("引数は ", val, " です"); // 表示されるのは 500 ですよね? } --> </SCRIPT>上記の例では、HTMLが呼び出されたとき発生する onLoadイベントで test_func を呼び出します。そのとき、引数として 500 を渡しています。
test_func 内の document.write で表示される結果は、「引数は500です」 になります
関数内の結果を返す(戻り値を返す)には return を使用します。
戻り値を戻す必要がない場合は、省略しても問題ありません。<SCRIPT LANGUAGE="JavaScript"> <!-- var val1 = 10; var val2 = 50; var val3 = test_func(val1, val2); // val3 は 10 + 50 で 60 ですよね・・・? function test_func(v1, v2) { document.write("引数1は ", v1, " です<BR>"); // 表示されるのは 10 ですよね? document.write("引数2は ", v2, " です<BR>"); // 表示されるのは 50 ですよね? return v1 + v2; } --> </SCRIPT>上記のスクリプトの場合、test_func を呼び出すとき引数として val1, val2 の2つの変数を渡しています。test_func は、val1, val2 の内容を表示した後、val1, val2 を加算し return します。
val3 に戻される結果は、return v1 + v2 から、10 + 50 で 60 となります。