関数記述と呼び出し

javascript

ある程度まとまった処理を1つの機能として定義したものを関数といいます。 特定の処理を関数として纏めることで、再利用性を高めたりソースを圧縮することができます。

JavaScript関数の書式

関数の書式

JavaScriptで関数を記述する場合、functionに記述します。

function 関数名(){
  処理;
}

定義した関数は「関数名();」で実行することができます。

関数名();

引数・戻り値のある関数の書式

関数には関数に渡す値である「引数」と、関数で処理した結果を戻す「戻り値」を設定することができます。 例えば消費税計算する関数の場合、商品価格を引数で渡して消費税計算をした結果を戻り値として返すなどの記述が可能です。

関数に設定された引数の数と、関数を呼び出す際の引数の数は同じ必要があります。

function 関数名(引数1,引数2,引数3,・・・){
  処理;
  return 戻り値;
}

上記の関数を呼び出す場合は以下のように記述します。

関数名(引数1,引数2,引数3,・・・);

関数のサンプル

引数なし関数の呼び出し

100円に消費税を加算して価格を表示する関数priceのサンプルです。引数・戻り値ともになく、全てprice関数内で処理します。

function price(){
  var notax = 100;
  var tax = 10;
  var taxprice = notax + notax * tax / 100;
  document.write("税込み価格:" + taxprice  + "円")
}
price();

実行結果

税込み価格:110円

引数あり関数の呼び出し

商品価格を引数で受け取り、消費税を加算して価格を表示する関数priceのサンプルです。

function price(notax){
  var tax = 10;
  var taxprice = notax + notax * tax / 100;
  document.write("税込み価格:" + taxprice  + "円")
}
var notax = 100;
price(notax);

実行結果

税込み価格:110円

引数・戻り値あり関数の呼び出し

商品価格を引数で受け取り、消費税を加算して価格を戻り値で返す関数priceのサンプルです。

function price(notax){
  var tax = 10;
  price = (notax + notax * tax/100);
  return price;
}
price(100);
document.write("税込み価格:" + price + "円");

実行結果

税込み価格:110円

関数にreturn文を設定したことにより、関数から戻り値を受け取る事ができます。 この場合は110を受け取ったわけです。

アマルウェブ HOME