プログラミングを学んでいると、同じような計算や処理を何度も書かなければならない場面が出てきます。
「さっきもこの計算書いたな……」
「10箇所にある同じメッセージを一気に書き換えたいけれど、全部探すのは大変」
そんな悩みを一瞬で解決してくれるのが「関数（function）」です。関数を使えるようになると、コードがスッキリ整理され、修正も一箇所で済むようになります。本記事では、JavaScriptの関数（function）の作り方から、データの受け渡しに欠かせない「引数」や「return」の使い方まで、初心者の方に向けてわかりやすく解説します。
関数とは？「料理のレシピ」や「自動販売機」でイメージしよう
関数とは、簡単に言うと「一連の処理をひとまとめにして、名前をつけたもの」です。
例えるなら、関数は「料理のレシピ」のようなものです。「カレーを作る」という手順（野菜を切る、煮込む、ルーを入れる）に名前をつけておけば、次からは「カレーを作って！」と言うだけで、中身の細かい手順をいちいち説明しなくても料理が完成します。
また、もっと厳密な仕組みを知りたいときは「自動販売機」をイメージしてください。
- お金を入れる（入力：引数）
- 中で「飲み物を冷やして出す」という処理をする
- 飲み物が出てくる（出力：戻り値）
このように、「何かを渡すと、決まった処理をして、結果を返してくれる箱」が関数です。
JavaScript関数の基本の作り方と呼び出し方
JavaScriptで関数を作ることを「関数の宣言」と呼びます。最も基本的な書き方はfunctionキーワードを使う方法です。
関数の作り方（宣言）
function sayHello() {
console.log("こんにちは!");
console.log("今日は良い天気ですね。");
}- function：これから関数を作りますよ、という合図。
- sayHello：関数の名前です。中身がわかる名前を自由に付けられます。
- { }：この中に、実行したい処理をまとめます。
関数の呼び出し方
関数は作っただけでは動きません。使いたい場所で名前を呼んであげる必要があります。
sayHello(); // ここで中身が実行される一度作っておけば、sayHello();と書くだけで、何度でも同じメッセージを表示させることができます。
データを渡す「引数」の使い方
「いつも同じメッセージではなく、相手の名前によって変えたい」という時に使うのが「引数」です。引数は、関数の外から中に渡す「材料」のようなものです。
function greet(userName) {
console.log("こんにちは、" + userName + "さん！");
}
greet("田中"); // 「こんにちは、田中さん！」
greet("佐藤"); // 「こんにちは、佐藤さん！」- (userName)：関数を作る時のカッコ内にある名前を「引数」と呼びます。これは関数の中だけ使える「一時的な変数」のようなものです。
- greet(“田中”)：呼び出す時のカッコ内に入れたデータが、userNameに放り込まれます。
合わせて読みたい：
JavaScript関数の結果を返す「return（戻り値）」の仕組み
関数の中で計算した結果などを、外の世界に持ち出したいときに使うのがreturn（リターン）です。これを「戻り値」や「返り値」と呼びます。
function double(number) {
return number * 2; // 計算結果を「外」へ放り出す
}
const result = double(10); // 戻ってきた「20」がresultに代入される
console.log(result); // 20returnの重要なルール
- 値を返す：returnの後ろに書いたデータが、関数の呼び出し元に届けられます。
- 処理を終了する：returnが実行された瞬間、その関数の処理はそこで終わり、それ以降の行は実行されません。
returnの後ろに書いた値は、関数を呼び出した場所に戻ります。
なぜ関数を使うのか？3つの大きなメリット
初心者のうちは「わざわざ関数にしなくても、そのまま書けばいいのでは？」と感じるかもしれません。しかし、関数を使うのには大きな理由があります。
①コードの再利用ができる
同じ計算式を5回書く代わりに、1つの関数を作って5回呼び出す方が効率的です。
②修正が圧倒的に楽になる
もし計算ルールが変わったとき、関数を使っていなければすべての箇所を直す必要があります。関数にまとめていれば、関数の「中身」を1箇所書き換えるだけで、すべての場所に反映されます。
③コードが読みやすくなる
長いプログラムも、「消費税を計算する関数」「ログイン判定をする関数」といった具合に小分けにすることで、何をしているコードなのかが一目でわかるようになります。
まとめ
関数は、プログラミングをスマートに、そして効率的にするための必須ツールです。
- 関数は処理のパッケージ。functionで作り、( )で呼び出す。
- 「引数」は関数に渡す材料。
- 「return」は関数から外へ出す結果報告。
- 一度作れば、修正は1箇所で済む。
function add(a, b) {
return a + b;
}
const result = add(3, 5);
console.log(result); // 8まずは、自分の年齢を引数に渡すと「あなたは成人です」「未成年です」と判定して返してくれるような、簡単な関数を作ってみることから始めてみてください！
