関数
Function
概要(サマリー)
ひとまとまりの処理に名前を付けて、必要なときに呼び出して使えるようにした仕組みのこと。
たとえば「2つの数字を受け取って足し算する」「ボタンを押したらメッセージを表示する」といった一連の流れを、ひとつの名前つき部品としてまとめたものが関数である。
同じ処理を何度も書かずに済むため、コードを短くしやすく、読みやすくもなる。
AIに「コードを整理して」「リファクタリングして」と頼むと、長く続いた処理を意味ごとに分けて関数にまとめてくれることが多い。
そのため関数は、AI時代のコード理解でもとても重要な基本概念である。
詳細解説
関数(Function)とは、処理をひとまとまりにして名前を付け、必要なときに呼び出せるようにした仕組みである。
初心者向けには、「よく使う作業をひとつのボタンに登録しておく」ようなものだと考えるとわかりやすい。
たとえば、毎回同じように
- 値を受け取る
- 計算する
- 結果を表示する
という流れを書くのは面倒である。
そこで、その流れに名前を付けておけば、次からはその名前を呼ぶだけで同じ処理を使える。
これが関数である。
なぜ関数が必要なのか
もし関数がなければ、同じ処理を何度もコピペして書くことになりやすい。
そうすると、
- コードが長くなる
- 修正箇所が増える
- 同じ処理なのに微妙なズレが出る
- 読みにくくなる
といった問題が起きやすい。
たとえば「税込価格を計算する処理」を10か所にベタ書きしていたら、計算ルールが変わったときに10か所全部を直さなければならない。
しかし関数にしておけば、1か所直すだけで済むことが多い。
つまり関数は、
処理の再利用 と 整理 のためにとても重要なのである。
どんなイメージで考えればよいか
初心者向けには、次のようなたとえがわかりやすい。
自動販売機
お金と商品番号を入れると、決まった流れで商品が出てくる。
入力に応じて結果を返してくれる部品という意味で、関数は自動販売機に近い。
電子レンジのワンボタン
「温めスタート」を押すと、中では時間設定や加熱が決まった流れで行われる。
利用者は中身を毎回書かなくても、ボタン1つで使える。
作業手順のテンプレート
「この手順をやるときはこれ」と、毎回同じ流れを呼び出せる形にしたものとも言える。
関数は何をするものか
関数は、主に次のような役割で使われる。
1. 処理をまとめる
長い処理を意味ごとに区切って整理する。
2. 再利用する
同じ処理を何度も呼び出せるようにする。
3. 入力に応じて結果を返す
渡された値を使って処理し、結果を出すことができる。
4. コードを読みやすくする
処理のかたまりに名前が付くため、「何をしているか」が分かりやすくなる。
入力と出力の考え方
関数を理解するときによく出てくるのが、引数 と 戻り値 である。
引数
関数に渡す入力のこと。
戻り値
関数が処理した結果として返す値のこと。
たとえば、「2つの数字を足して返す関数」なら、
- 引数 = 2つの数字
- 戻り値 = 足し算した結果
となる。
初心者向けには、
材料を入れると結果が出てくる箱
と考えると分かりやすい。
簡単な例
たとえば JavaScript では、次のような関数がある。
function add(a, b) {
return a + b;
}
これは a と b を受け取り、その合計を返す関数である。
使うときは、次のように呼び出す。
const result = add(2, 3);
console.log(result); // 5
ここでは、
2と3が引数5が戻り値
になる。
関数を「呼び出す」とは
関数は、定義しただけでは普通は動かない。
必要なときに呼び出すことで実行される。
つまり関数には大きく2段階ある。
- こういう処理です、と定義する
- 必要な場面で呼び出す
この考え方が分かると、「書いたのに動かない」という初歩的な混乱を減らしやすい。
関数が役立つ場面
関数は、実際の開発で非常によく使われる。
たとえば次のような場面である。
1. 計算処理
税込価格計算、割り勘計算、確率計算など。
2. 表示処理
モーダルを開く、エラーメッセージを表示する、一覧を描画するなど。
3. データ変換
文字列整形、日付変換、配列加工など。
4. イベント処理
ボタンクリック時の処理、フォーム送信時の処理など。
つまり、意味のあるひとまとまりの処理 は、関数にできることが多い。
関数にすると何がよいのか
関数には多くのメリットがある。
1. 同じ処理を何度も書かずに済む
再利用しやすくなる。
2. 修正がしやすい
1か所直せば済むことが多い。
3. コードが読みやすくなる
長い処理を「何をする関数か」という名前で分けられる。
4. テストしやすくなる
小さな処理単位で確認しやすい。
長いコードを関数に分ける意味
初心者が書いたコードや、急いで作ったコードは、1つの場所に処理が長く続きやすい。
そうすると、
- 何をしているのか分からない
- どこを直せばよいか分からない
- 一部だけ再利用できない
という問題が起きる。
そこで、意味ごとに関数へ分けると、
- 入力チェックの関数
- 計算の関数
- 表示更新の関数
のように役割を整理できる。
このため、関数はコード整理の基本手段でもある。
関数と変数の違い
初心者が混同しやすいのが、変数との違いである。
変数
値を入れておく箱。
関数
処理をまとめておく箱のようなもの。
つまり、
- 変数 = データを持つ
- 関数 = 動作を持つ
と考えると分かりやすい。
関数とクラスの違い
これも混同しやすい。
関数
ある処理をひとまとめにしたもの。
「何をするか」に重点がある。
クラス
データや機能をまとめて設計するもの。
「どんなものか」に重点がある。
たとえば「税込価格を計算する」だけなら関数で十分なことが多い。
一方、「商品」という概念全体を扱いたいならクラスが向いていることがある。
フロントエンドでの関数
フロントエンドでは、関数はとてもよく使われる。
たとえば、
- ボタンを押したときに実行する
- 入力内容をチェックする
- 表示を切り替える
- APIの結果を画面に反映する
といった処理は、多くの場合関数でまとめられる。
そのため、JavaScript を読むときは関数を見つけられるようになると、一気に構造が分かりやすくなる。
AI時代にも関数は重要
AIは、長い処理を整理するときに関数へ分けることが非常に多い。
また、新しくコードを書くときも、意味のある単位ごとに関数を作ることが多い。
そのため、AIの出力に
function calculateTotal()function openModal()function fetchData()
のようなものが出てきたとき、
「これはこういう役割の処理のかたまりなんだな」
と理解できることが大切である。
さらに、AIへ
- この処理を関数に切り出してください
- 共通処理を関数化してください
- 関数名を分かりやすくしてください
と依頼できるようになると、コード整理の質がかなり上がる。
より詳しくAIに聞いてみよう
- 関数とは何かを、中学生でもわかるように説明してください。
- 引数と戻り値の違いを、具体例つきで教えてください。
- なぜ長いコードを関数に分けると読みやすくなるのか説明してください。
- 関数と変数、関数とクラスの違いを整理してください。
- AIに「この処理を関数化して」と頼むときの指示例を教えてください。