javascriptでコードを書いていると必ずとっていいほど出てくるfunctionですがちゃんと意味を説明できる人はどれだけいるでしょうか？
とりあえず意味を知らずに使っているという人や本やネットを参考に書いたら動いたからなんとなくで使っているという人もいるかもしれません。
functionとは
functionとは調べると関数と意味になります。
関数と聞くと中学生や高校で習う関数を思い浮かべる人も多いと思います。
javascriptの関数は与えられたものに対して処理して結果を返すものと覚えておくとよいでしょう。
身近にあるもので例えてみると
javascriptで使うfunctionをものに例えてわかりやすくしますね。
たとえば自動販売機を例にしたいと思います。
自動販売機とはお金を入れるとジュースが出てくるという私たちの身近にあるものです。
余談ですが最近の自販機はジュースだけでなくカップラーメンからお菓子、野菜まで売っているところもあるようです。
それはいいとして自動販売機の流れとしては下記になります。
- お金を入れてすきなジュースを選んでボタンを押す
- 自動販売機がなかで処理をはじめる
- 選んだジュースが出てくる
このような流れになっていますがこれの流れをまとめたものが関数でもあります。
さきほども伝えましたが関数は与えられたものに対して処理して結果を返すものです。
もう少し詳しく説明すると1番目はお金を入れてボタンを押すというアクションをします。
そして入れたお金とボタンを入れるというアクションに対して自動販売機がなかで処理をはじめます。
このときお金がいくら入ったのか？またどのボタンが押されたかを判断して最終的に選んだジュースがでてくるという結果を返しています。
この一連の流れが関数になります。
関数を使うメリット
javascriptではfunctionを使用することが多いと思います。
また関数とは同じ処理を繰り返し使う場合にとても便利です。
WEBサイトが大きくなってくるとページによって同じ処理が必要になることも多くなると思います。
同じコードがどんどん増えてしまうとコード自体が長くなりファイルが重くなってしまったり見た目もスマートではありません。
そんなときに関数を使うことで使いたいときに何度も使用することができるのでコードもすっきりしますしファイルも軽くなります。
関数の定義
それでは関数を定義するときのコードを見てみましょう。
<script>
function 関数名( ) {
処理
}
</script>関数名は任意の名前を付けます。
呼び出すときは関数名を宣言して使用します。
処理の部分には関数が呼び出されたときに行う処理を書きます。
コメント