JavaScript学習プラン　Day5

1週目の全体目標

基本的な文法を習得し、簡単なプログラムを自力で書けるようになること。各日ごとにテーマを設定し、理解を深めるための演習も実施します。

Day5

繰り返し処理（ループ）
目的: 繰り返し処理を使って、同じ操作を自動的に行う方法を理解する。

【学習内容】
forループの基本（約40分）
基本的なforループの書き方と使用方法。

whileループの理解（約30分）
whileループと無限ループに注意する方法。

演習（約50分）
1から10までの数を表示するプログラムを作成。
リストの要素をすべて表示するプログラムを作成。

/************ 
繰り返し処理（ループ）

目的: 繰り返し処理を使って、
同じ操作を自動的に行う方法を理解する。
 ***********/


/************ 
forループの基本
 ***********/
for (let i = 1; i <= 10; i++) {
    console.log(i);
}

/************ 
whileループの基本
 ***********/
let i = 1;
while (i <= 10) {
    console.log(i);
    i++;
}

// 『i++』を忘れると、無限ループが発生する

/*
forループとwhileループの違い

forループ：通常、ループの回数が決まっている場合に使用。

whileループ：特定の条件がtrueの間、繰り返し処理を行いたいときに使用。
ループの終了条件が不確定な場合に便利です。
*/ 



// 課題 1: 1から10までの数を表示するプログラムを作成
for (let i = 1; i <= 10; i++) {
    console.log(i);
}

// 課題 2: リスト（配列）の要素をすべて表示するプログラム
let fruits = ["リンゴ","バナナ","オレンジ"];

for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

//課題 3: 1から100までの偶数だけを表示するプログラム
for (let i = 2; i <= 100; i+=2) {
    console.log(i);
}

// 5. 応用：FizzBuzzプログラム
/*
1から100までの数字を表示し、3の倍数のときは「Fizz」、
5の倍数のときは「Buzz」、両方の倍数のときは「FizzBuzz」を表示します。
*/ 
for (let i = 3; i <= 100; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
        console.log("FizzBuzz");
    } else if (1 % 3 === 0) {
        console.log("Fizz");
    } else if (i % 5 === 0) {
        console.log("Buzz");
    } else {
        console.log(i);
    }
}

day5前に、復習でプログラム制作～！
前回復習で作った、BMI計算のプログラムに
Day4でやった、『if、else if、else』を使ってBMI数値に合わせた、メッセージを表示を追加。

function calculate() {
  let num1 = parseFloat(document.getElementById("num1").value);
  let num2 = parseFloat(document.getElementById("num2").value);

// 数値が正しいか確認＆エラーメッセージ
  if (isNaN(num1) || isNaN(num2)) {
    document.getElementById("result").innerHTML = '正しい数値を入力してください';
 return;
 }

//  BMI計算
  const  heightMeters = num1 / 100; //身長
  const bmi = num2 / (heightMeters *  heightMeters); //体重

//   数値に合わせたメッセージ
  if (bmi < 18.5) {
    message = "低体重（痩せ型）";
  } else if (bmi >= 18.5 && bmi < 25) {
    message = "普通体系";
  } else {
    message = "肥満";
  }

  document.getElementById('result').innerHTML = `あなたのBMIは${bmi.toFixed(2)}です。<br>日本肥満学会の判定基準では${message}です。`; 
}

最初1週間は、予定通り進みそうなペース。
多分、大変なのは2週間目以降～後半に来るんだ、、、震

『なんとなく、わかってる』が『理解してる』に近づくように
がんばろー