引数JavaScript入門

引数を使ったサンプル

以下のサンプルでは、引数を使って関数に数字を渡しています。 関数内でそれを２乗して、計算結果を呼び出し元に返しています。

<script>
function sqr(a){

  return a + "の２乗は" + a*a + "です。";

}

document.write( sqr(2) + "<br>" );
document.write( sqr(5) + "<br>" );
document.write( sqr(123)  + "<br>" );

</script>

サンプル（別窓）

サンプルページを見ると、2,5,123をそれぞれ2乗した計算結果が表示されています。

引数とreturnの解説

では詳しく見ていきましょう。

function sqr(a){}

関数sqr()のカッコ内に a という文字が入っています。 このaが引数です。 余談ですが、関数名は2乗を意味する英語squareから取りました。

return a + "の２乗は" + a*a + "です。";

関数sqr()の中身は1行だけです。 returnというのが最初にありますが、これは、値を呼び出し元に返す命令です。 returnの後に、返す値を記述します。 今回は「○の2乗は○○です。」という数字と文字列を組み合わせた値を呼び出し元に返します。

return a + "の２乗は" + a*a + "です。";

アスタリスク( * )が掛け算なのは前に出てきました。a×aで2乗を計算しています （因みに、べき乗を計算するJavaScriptの命令文もあります）。

document.write( sqr(2) + "<br>" );

その後、document.write()のカッコ内で、この関数を呼び出しています。 最初は引数に2を指定して、関数を呼び出します。 2の2乗を計算した結果が、関数から返ってきます。 それを書き出しています。

document.write( sqr(5) + "<br>" );
document.write( sqr(123)  + "<br>" );

次は5の2乗、さらに123の2乗も計算して、document.write()で書き出しています。

このように引数を使うと、１つの関数を使い回すことができます。 引数にいろいろな数字を入れて試してみてください。

複数の引数を持つ関数

引数は複数指定することもできます。 例えば以下のように、面積を計算する関数では、２つの引数を持たせています。

<script>
function area( w , h ){

  var str = "幅" + w + "m,高さ" + h + "mの長方形の面積は";
  return str + w*h + "平方メートルです。";
}

document.write( area(5,12) );

</script>

サンプル（別窓）

上記の関数area()は、w,hという２つの引数を持っています。 それぞれの引数は、コンマで区切ります。

関数内は、1行に書くとちょっと長くなるので、 変数strを使って前置きの部分を格納しました。 「幅○m,高さ△mの長方形の面積は◇です。」 という文字列を、returnで呼び出し元に返しています。

幅5m、高さ12mの長方形の面積を計算させて、document.write()で書き出しています。