0
0

More than 1 year has passed since last update.

はじめてのJavaScript⑮ 「function命令」

Last updated at Posted at 2021-10-31

1. はじめに

本記事では、JavaScriptの
「function命令」
について記載する。

2. function命令とは?

様々な処理を1つにまとめて、名前をつけることができるもの。

単調な処理を1つにまとめて、どこからでも使えるように効率化するという目的でよく使用される

1つにまとめることで同じ処理を何度も書く必要がなくなりミスが減るうえ別のプログラムに使いまわすことも可能になる。

3. 構文

構文は以下のようになる。

index.js
index.js
function 関数名 (引数1引数2...) {
  //任意の処理
  return 戻り値
}

構文の補足

引数とは、関数の呼び出し元から、関数へ値を渡すときに使う特別な変数のこと。

戻り値とは、関数から関数呼び出し元へ返す値のこと。

4. 例題

例題の内容は、過去に記載した記事より参照→はじめてのJavaScript⑭ 「関数」 5.例題より

例題の内容

例題は「四角形の面積を計算する関数」というテーマで進めていく。

四角形の縦の長さと横の長さを引数に渡すと、四角形の面積(縦×横)を計算して、値を返す関数を作る。

作った関数を使って、高さ3m、横幅5mの四角形の面積を求め、コンソールへ出力する。

※単位はとする。(単位の出力は不要)


四角形の面積を計算する関数をfunction命令で書く

index.js
index.js
function getRectangle(height, width) {
  return height * width;
}
console.log(getRectangle(3, 5));


上記構文に関して、順を追って解説していく。

function getRectangle(height, width)

下記リンクにgetRectangleという関数の表記がある。 キャプションをその中に描画する矩形を取得する という役割。

GetRectangle メソッド

return height * width;

引数には高さを表すheightと横幅を表すwidthを指定する。

returnの内容は、四角形の面積を求める式と同様に縦×横で記述する。

console.log(getRectangle(3, 5)

コンソールへ出力し、getRectangle内の引数へそれぞれ値を与える。


function命令の読み解き方

fanction命令の構文は、以下のように読み解く。

コンソールへ出力した値をfunction内の引数にそれぞれ代入し、returnの部分で四角形の面積を求める計算式で返してあげる。


デベロッパーツールでの検証

縦3と横幅5の面積は15㎡となるはずなので、
スクリーンショット 2021-10-31 14.52.58.png
正しく15と出力することができた。

5. おわりに

次項:はじめてのJavaScript⑯ 「関数リテラル」に続く。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0