【誰でもわかる!】関数とは

2020年8月27日

プログラミングを勉強していく中で、関数とは非常に便利な存在です!

完全に理解して使いこなせるようになるまでは、少し時間がかかるかもしれませんが、使いこなせるとプログラムがきれいになるなど様々なメリットがあるため、ぜひマスターしてほしいと思い、この記事を書いています!

関数をマスターすることで、自分が書いたコードが見やすくなったり、コードを短くできて便利になるなどいろいろな利点があります!

今回は主にJavaScriptの関数の説明をしますが、ほかのプログラミング言語にも共通することはたくさんあるので、ぜひ参考にしてください!


その前に…

今回の関数の説明には、変数条件分岐の知識があるととても分かりやすいと思いますので、変数や条件分岐についてあまり知らないという方は私の過去の記事をぜひ読んでください!

【誰でもわかる!】変数とは

プログラミングの勉強を始めたときに最初に学ぶのが、「変数」と呼ばれるものです。 変数を知ることはプログラミングを知ることと同じといっても過言ではありません! この記事では、主にJavaScriptの変数について解説します […]

【誰でもわかる!】条件分岐とは

プログラミングを勉強していく中でとても大事になってくるのが条件分岐です。ゲームでの当たり判定など条件分岐はとてもよく使われるものです! 今回は主にJavascriptの条件分岐について詳しく書いていきますが、ほかの有名な […]


関数の説明

関数というのを簡単に説明すると、レストランで注文することと同じ、と説明すると分かりやすいでしょう!

つまりどういうことかといいますと、
例えばあなたが店員さんに、

「ハンバーグ定食をください。」

といったとき、あなたは遠回しに、

店員さんが料理人にハンバーグとみそ汁とごはんを作るように指示する

できたものをプレートに乗っける

自分のところに持ってくる

という仕事を依頼していますよね。
そうですこれが関数といったものです。

そして、

あらかじめ仕事を決めておき、簡単な名前で呼び出す

ということが関数の一つの役割です!

今の例をJavaScriptのコードっぽく書いて見ます!

<script>
  function ハンバーグ定食() {
    ハンバーグとみそ汁とごはんを作る;
    プレートに乗っける;
    客のところに持っていく;
  }


  ハンバーグ定食();

</script>

このような感じです。

あらかじめハンバーグ定食という仕事を決めておき、必要な時に、ハンバーグ定食()で仕事をさせることができます!


実際にコードを書いてみる

実際にJavaScriptのコードを書いてみたいと思います。

今から、変数 aと変数 bを足し算するというコードを書いて見ます!

<script>
  let a = 3;
  let b = 4;
  let c = 0;

  function tashizan() {
    c = a + b;
  }

  tashizan();
</script>

このような形になります!
これを実行すると c は最終的に7になります!

変数を使っているだけで、tashizanという仕事をあらかじめ決めておき、その名前で呼び出すといった部分は変わっていませんね!

ではここでもう一つコードを書いて見ましょう!
そして結果がどのようになるか考えてみましょう!

let a = 4;

function keisan() {
  a = a + 3;
}

keisan();
keisan();

このコードを実行したら最終的に a の値は何になるでしょうか?

ヒント:今回はkeisanという仕事を2回呼び出しているので、先ほどのハンバーグ定食の例だと、ハンバーグ定食が2つ出てきますね。

答えは、10になります!

一回目にkeisanを呼び出すと、

a = a + 3;

が実行されるので、a = 4 + 3 から a は7になりますね。

そして二回目にkeisanが呼び出されたときには、 a = 7 + 3 になるので、答えは10です!


関数のもう一つの役割

関数には、たくさんの役割があるのですが、よく使うものとしては先ほどの、

あらかじめ仕事を決めておき、簡単な名前で呼び出す

ともう一つ、

何かを実行し、その結果を返す

というものが挙げられます!

ハンバーグ定食の例をまたここで挙げると、一つ目の役割(=あらかじめ仕事を決めておき、簡単な名前で呼び出す)というものは、

「ハンバーグ定食をください。」

だったのに対して、二つ目の役割(=何かを実行して、その結果を返す)というものは、

「ハンバーグ定食はまだ作れますか?」

という尋ね方になります。
今の尋ね方には遠回しに以下のようなことを命令していますね。

店員さんが料理人にハンバーグ定食を作る材料が十分にあるか聞く。

作れる場合→お客さんに「作れます」と結果を返す。
作れない場合→お客さんに「作れない」と結果を返す。

これが関数の二つ目の役割で、結果を返すということがとても大事です!

ではこの例も同様にコードっぽく書いて見ましょう!

function ハンバーグ定食はありますか() {
  if (材料が十分にある){
    return 「作れます」;
  } else {
    return 「作れません」;
  }
}


ハンバーグ定食はありますか();

return というのは「結果を返す」という意味で、今回は、作れるか作れないかの結果を報告しています

条件分岐(=if)で場合分けしていて、材料が十分にある時には、「作れます」と、ないときには「作れません」と return(=結果を返す)しています!


実際にコードを書いてみる

実際にJavaScriptのコードを書いて見ます。

function hikizan() {
  let a = 3;
  let b = 4;
  let c = a + b;

  return c;
}

let d = hikizan();

今までに見たことがない書き方が出てきていますが、難しく考えずに見てみましょう。

まず、hikizanという仕事は、 c を結果として返すようになっているため、hikizanは、 3 + 4 = 7 から、7を結果として返すように設定されています。

ここで、dという変数は、= hikizan() とあるように、hikizan() の結果になるようになっています!

なので最終的には、dは、hikizanの結果の7になります!

始めてみる形で戸惑うかもしれませんが、落ち着いてみると意外と簡単かもしれません!

ではここでもう一つ例を出すので、結果が何になるか考えてみましょう!

function kakezan() {
  let a = 2;
  let b = 3;

  return a * b;
}

let c = 0;

if (kakezan() > 5) {
  c = 1;
} else {
  c = 2;
}

この時、cは最終的にどんな値になるでしょう?

ヒント:「*」は掛け算「×」の意味です!

答えは、
cは1になります!

今回は条件分岐の中に関数が出てきましたね。これも難しく考えずに落ち着いて考えてみましょう!

まずkakezanという関数は、return a * b;とあるように、a×bの結果を返すようになっています。
ここで、a×bは6なので、kakezanは6を返します。

ここでif (kakezan() > 5)は、kakezanが6になるので、c = 1;が計算されて、cは1になります!

もし難しくて少し理解できなかった場合は、条件分岐の記事ももう一度しっかり読んでみてみましょう!

またわかってくることがあるかもしれません!


引数(ひきすう)

最後に紹介するのが、「引数(ひきすう)」です!

これを使うととても便利になるので、覚えましょう!

また先ほどのレストランの例で考えてみましょう!

先ほどは、「ハンバーグ定食はありますか?」という一言で、一つの関数を作ったので、例えば「オムライスはありますか?」という一言のために、関数をまた作り直さなければいけません。

料理名一つに関数を一つ作ったら、料理が100個あったら関数を100個作らなければだめですね…

でももしこれが、「〇〇はありますか?」という形でくくって、〇〇に対応する処理を別々に用意出来たら便利になりそうですよね?

つまり下の通りにできたらいいわけですね!

〇〇はありますか?

もし、〇〇がハンバーグ定食だったら、ハンバーグ定食が作れるか確認する。
もし、〇〇がオムライスだったら、オムライスが作れるか確認する。

これを可能にするのが、引数です!

実際に今の例をコードっぽく書きますので、見てみましょう!

function ありますか(〇〇) {
  if (〇〇 == ハンバーグ定食) {
    ハンバーグ定食が作れるか確認する;
  } else if (〇〇 == オムライス) {
    オムライスが作れるか確認する;
  }
  …
}

ありますか(ハンバーグ定食);
ありますか(オムライス);

先ほどまで、何気なくつけていた()がここで使われましたね!
()の中に料理名(ここでは文字ですが、もちろん数字でもなんでも)を書き、関数に渡すことができます!


実際にコードを書いてみる

またJavaScriptのコードを書いて見ます!
今回はここで結果がどうなるか考えてみましょう!

let a = " “;

function hantei(age) {
  if ( age >= 20) {
    a = “二十歳以上";
  } else {
    a = “未成年";
  }
}

hantei(15);

これを実行したときに、a は最終的に何になるでしょうか?

答えは、
a は"未成年"になります!

引数を使った年齢を判定するコードですね!

hantei(15);となっていますので、hanteiという仕事に15を渡しています。
そしてhantei(age)となっていることから、ageは15になります!
あとは条件分岐で、ageは15のため、a は、elseの方の"未成年"に なりますね!

今の例のように、引数には数字などを渡すことができるという便利な点があります!
使いこなせるようになりましょう!


これであなたも関数マスター!

今回学んだことで、関数の基礎は完璧です!

あとはうまく使いこなせるかがとても大事です!
最初にも書いた通りに、関数を使えば、きれいなプログラムを書くことができます!
なので、関数をマスターすることはプログラミング上級者に一歩近づけるということです!

今回学んだ、関数の2つの役割、

あらかじめ仕事を決めておき、簡単な名前で呼び出す

何かを実行し、その結果を返す

と、引数は忘れないように何度も繰り返して使ってみましょう!

関数についてわからないことがあればコメントお待ちしております!
Twitterも行っていますのでご意見もあればぜひ!

Twitter開設しました!

ただの大学生のブログが更新されたときや、様々な情報を載せるためのTwitterを開設しました!ブログの裏側を載せたり、読者の方の質問に応えたりします! TwitterのIDはこちらです。@Daigakusei_blog […]