10分でわかる!関数 -はじめてのプログラミング体験

はじめてのプログラミング体験

これまで基本的な構文と変数条件分岐(if文)といったプログラミングを体験してきました。今回はプログラミングさらにはプログラミング的思考に欠かすことのできない「関数」について学びましょう。

ここでの目的は実際のプログラミングを一度経験することです。習得ではないので、プログラミングした気分になって読むだけでも大丈夫です。プログラミングがまったくのはじめてなら「はじめてのプログラミング体験レッスン一覧」から始めましょう。

プログラミングの関数とは?

「関数」というと一次関数、二次関数、指数関数、対数関数といった数学の関数を思い浮かべるでしょう。数学の関数に苦手意識を持つも人いるかもしれませんが、プログラミングの関数は数学のとは違います。公式の暗記やグラフの作成といったものはないので安心してください。

プログラミングの関数は、ひとかたまりの処理をまとめるものです。関数を使うと以下のようなメリットがあります。

  • 同じことを何度も繰り返し書かずに済む(共通化・汎用化)
  • ソースコードが読みやすくなる(可読性の向上)
  • 修正や変更が簡単になる(保守性の向上)
  • 他の人の力を借りることができる(コードの再利用・開発効率の向上)

メリットだけ列挙されてもピンとこないと思います。関数を使うメリットをソースコードで具体的に見ていきましょう。

関数を使わない場合

関数のメリットを知るには、まず関数を使わない場合の不便さを体験するのが一番です。

14歳の年齢区分を判定するには以下のようなコードが必要でした。(過去記事「10分でわかる!if 文」で紹介しています。)

var age = 14;
if (age < 6) {
    document.write('幼年期');
} else if (age < 15) {
    document.write('少年期');
} else if (age < 30) {
    document.write('青年期');
} else if (age < 45) {
    document.write('壮年期');
} else if (age < 65) {
    document.write('中年期');
} else if (age < 75) {
    document.write('前期高年期');
} else {
    document.write('中後期高年期');
}

さらに40歳の年齢区分を判定する必要がある場合はどうでしょうか。以下のようなソースコードになります(無駄に長いので読み飛ばしてください)。

var age = 14;
if (age < 6) {
    document.write('幼年期');
} else if (age < 15) {
    document.write('少年期');
} else if (age < 30) {
    document.write('青年期');
} else if (age < 45) {
    document.write('壮年期');
} else if (age < 65) {
    document.write('中年期');
} else if (age < 75) {
    document.write('前期高年期');
} else {
    document.write('中後期高年期');
}
document.write('<br>');// 改行

age = 40;
if (age < 6) {
    document.write('幼年期');
} else if (age < 15) {
    document.write('少年期');
} else if (age < 30) {
    document.write('青年期');
} else if (age < 45) {
    document.write('壮年期');
} else if (age < 65) {
    document.write('中年期');
} else if (age < 75) {
    document.write('前期高年期');
} else {
    document.write('中後期高年期');
}

さらに5歳、20歳、27歳、51歳 … と追加要望がきたらどうでしょう。

コピー&ペーストの連続でソースコードはどんどん膨らんで煩雑なものになってしまいます。

問題はそれだけではありません。もし年齢判定の仕組みに間違いや変更があったら、あちこち修正しなければなりません。

そこで関数の出番です。

関数を使う場合

関数を使うと5歳、14歳、20歳、27歳、40歳、51歳、66歳、80歳について年齢区分判定を行う場合でも、以下のようにわずか30行以内でスッキリ書けてしまいます(関数を使わない場合には140行程になってしまいます)。

※コードの意味はこのあと補足します。

function showClassification(age) {
    document.write(age + '歳は');
    if (age < 6) {
        document.write('幼年期');
    } else if (age < 15) {
        document.write('少年期');
    } else if (age < 30) {
        document.write('青年期');
    } else if (age < 45) {
        document.write('壮年期');
    } else if (age < 65) {
        document.write('中年期');
    } else if (age < 75) {
        document.write('前期高年期');
    } else {
        document.write('中後期高年期');
    }
    document.write('<br>');// 改行
}

showClassification(5);
showClassification(14);
showClassification(20);
showClassification(27);
showClassification(40);
showClassification(51);
showClassification(66);
showClassification(80);

実行画面

10分でわかる関数 サンプル実行画面

ソースコードの説明

冒頭で説明したように(プログラミングの)関数は、ひとかたまりの処理をまとめるものです。ここでは年齢から年齢区分を判定する処理を showClassification という名前の関数にまとめたのです。

function showClassification(age) {
 // 省略
}

関数はこのように function 関数名(引数) { … } という構文で定義します。

引数なしの関数、引数を複数個持つ関数、値を返す関数など、関数を定義する構文は他にもあります。コーディングを習得したい方はJavaScriptの専門書やWebサイトを調べてみましょう。

関数を定義したら、それを使っていきます。使い方は 関数名(実際の引数) とするだけです。

showClassification(5);
showClassification(14);
showClassification(20);

5歳、14歳、20歳・・・と年齢が変わっても、定義した showClassification という名前の関数に受け渡す数(引数)を変えるだけで済むことがわかります。

もし年齢判定の仕組みに間違いや変更があっても、あちこちを修正する必要はありません。showClassification 関数の中身を書き換えるだけです!

記事冒頭で挙げた関数のメリットのうちの上3つを実感できたかと思います。

  • 同じことを何度も繰り返し書かずに済む(共通化・汎用化)
  • ソースコードが読みやすくなる(可読性の向上)
  • 修正や変更が簡単になる(保守性の向上)
  • 他の人の力を借りることができる(コードの再利用・開発効率の向上)

他の人の力を借りれる

今回は自分で showClassification という関数を定義して使用しましたが、他の人が定義した関数を使用することもできます。また、プログラミング言語によっては、現在時刻を取得する、文字列を暗号化する、メールを送信する・・・といった様々な関数がもともと用意されています(組み込み関数または標準関数と呼ばれます)。

これまではゼロからすべて自分1人でプログラミングしてきましたが、関数により他の人と協力しながらプログラミングができるようになります。

豆知識

関数はソースコードを再利用する最も簡単な手段ですが、他にも再利用のための手段がいくつも用意されています。実際の開発現場ではクラス(オブジェクト)、モジュール、ライブラリ、フレームワークといった形で公開・配布され、コードは再利用されます。

この記事のソースファイルはこちらからダウンロードできます。実際のソースコードを体験してみましょう。

お疲れさまでした。コピー&ペーストを繰り返さず、何度も使う処理を効率的に関数にまとめる訓練は、プログラミング的思考を培うのにとても効果的なので、関数を定義して使う練習をしてみましょう。次回はループを予定しています。

次の記事「10分でわかる!ループ(反復処理) -はじめてのプログラミング体験」を読む。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です