JavaScript | ゼロからはじめるプログラミング、30日で基礎を学ぶJavaScript:JavaScriptを使えるレベルにする - Day9:関数① 練習問題

JavaScript JavaScript
スポンサーリンク

Day9 関数①の練習問題

Day9 のテーマは function / 引数 / return
ここでは、関数の基本をしっかり理解するための練習問題と、
それぞれの解答・解説をまとめていきます。

関数は「処理をまとめて名前をつける」ための最重要パーツなので、
ここで確実に身につけておきましょう。


基本の function を理解する問題

問題1:挨拶を表示する関数を作る

「こんにちは」と表示する関数 greet を作り、
それを呼び出してください。

解答例

function greet() {
  console.log("こんにちは");
}

greet();
JavaScript

解説

function で関数を定義し、
greet(); のように () をつけて呼び出す のがポイントです。
関数は「定義しただけでは動かない」ことを覚えておきましょう。


引数の練習問題

問題2:名前を受け取って挨拶する関数を作る

引数 name を受け取り、
「〇〇さん、こんにちは」と表示する関数 greet を作ってください。

解答例

function greet(name) {
  console.log(name + "さん、こんにちは");
}

greet("Taro");
greet("Hanako");
JavaScript

解説

引数 name は「関数の中だけで使える変数」です。
呼び出し側で渡した値が name に入ります。
関数の柔軟性が一気に上がるポイントです。


複数の引数を扱う問題

問題3:名前と年齢を受け取って紹介文を表示する関数を作る

引数 name と age を受け取り、
「〇〇さんは△△歳です」と表示する introduce 関数を作ってください。

解答例

function introduce(name, age) {
  console.log(name + "さんは" + age + "歳です");
}

introduce("Taro", 20);
introduce("Hanako", 25);
JavaScript

解説

引数はカンマで区切って複数指定できます。
関数の中では、普通の変数と同じように扱えます。


return の基本を理解する問題

問題4:2つの数を足して返す関数 add を作る

引数 a と b を受け取り、
その合計を return する関数 add を作ってください。

解答例

function add(a, b) {
  return a + b;
}

const result = add(3, 5);
console.log(result);  // 8
JavaScript

解説

return は「関数の答えを返す」ために使います。
return された値は、呼び出し側で変数に入れて使えます。


return の動きを深く理解する問題

問題5:点数が 80 以上なら「合格」、それ以外なら「不合格」を返す関数を作る

関数 judgeScore(score) を作り、
score に応じて文字列を return してください。

解答例

function judgeScore(score) {
  if (score >= 80) {
    return "合格";
  }
  return "不合格";
}

console.log(judgeScore(90));  // "合格"
console.log(judgeScore(70));  // "不合格"
JavaScript

解説

return に到達した時点で関数は終了します。
この性質を利用すると、条件分岐がスッキリ書けます。


関数の再利用性を体感する問題

問題6:税込み金額を返す関数 calcTotal を作る

引数 price と taxRate を受け取り、
税込み金額を return する関数 calcTotal を作ってください。

税込み金額 = price + price * taxRate

解答例

function calcTotal(price, taxRate) {
  return price + price * taxRate;
}

console.log(calcTotal(1000, 0.1));  // 1100
console.log(calcTotal(2500, 0.1));  // 2750
JavaScript

解説

同じ計算を何度も書く必要がなくなり、
関数の中身を変えれば全体に反映されるため、
「修正に強いコード」になります。


セキュリティ視点の練習問題

問題7:パスワードが8文字以上なら true、短ければ false を返す関数を作る

関数 isValidPassword(password) を作ってください。

解答例

function isValidPassword(password) {
  if (password.length >= 8) {
    return true;
  }
  return false;
}

console.log(isValidPassword("abc123"));      // false
console.log(isValidPassword("abc12345"));    // true
JavaScript

解説

パスワードチェックのような「重要なロジック」は
関数にまとめておくことで、
チェック漏れやバラバラな実装を防ぎ、
セキュリティを高めることができます。


応用問題(関数 × 条件分岐)

問題8:年齢を受け取り、区分を返す関数を作る

次のルールで区分を返す関数 getCategory(age) を作ってください。

  • 0〜12 → “子ども”
  • 13〜19 → “ティーン”
  • 20以上 → “大人”

解答例

function getCategory(age) {
  if (age <= 12) {
    return "子ども";
  }
  if (age <= 19) {
    return "ティーン";
  }
  return "大人";
}

console.log(getCategory(10));  // "子ども"
console.log(getCategory(16));  // "ティーン"
console.log(getCategory(30));  // "大人"
JavaScript

解説

return を使うことで、
「条件に合った時点で関数を終了する」
という書き方ができ、コードが読みやすくなります。


Day9 練習問題まとめ

Day9 の練習で身につくことは次の通りです。

function で処理をまとめる
引数で外から値を受け取る
return で結果を返す
関数を使うことでコードが再利用しやすくなる
重要なロジックを関数に閉じ込めることで安全性が上がる

関数は JavaScript の中心的な仕組みなので、
ここをしっかり理解しておくと Day10 以降が一気に楽になります。

タイトルとURLをコピーしました