2025年8月21日
If文、論理演算子とは
/// ===================================
// 🖥 ログイン状態チェックプログラム（false 判定）
// ===================================
// ユーザーがログインしているかどうかを表す変数
let isLoggedIn = false;
// true = ログイン済み、false = 未ログイン
// if(条件式) { ... } は「もし条件がOKなら…する」
// === は「左と右がまったく同じか」を調べる
if (isLoggedIn === false) { // isLoggedIn が false のとき実行
console.log("🚪 ログインしてください ");
}
// 【補足】
// if (isLoggedIn === false) は「もし isLoggedIn が false なら…」という意味
// === は省略できる場合もある
// 例）if (isLoggedIn === true) → if (isLoggedIn)
// if (isLoggedIn === false) → if (!isLoggedIn)
// true = 「はい / OK」、false = 「いいえ / NG」
//
// 【!（NOT演算子）について】
// 「!」は「反対・逆」を意味します。
// 例）!true → false
// !false → true
// つまり、if (!isLoggedIn) は「もしログインしていないなら…」という意味になります。
// ===================================
// 🖥 ログイン状態チェックプログラム（true 判定)
// ===================================
console.log(" ↓↓ 今回は最初に変数 isUserLoggedIn の値を true で設定しておく。");
let isUserLoggedIn = true;
// 変数 isUserLoggedIn にログイン状態を代入する
// true = ログイン済み、false = 未ログイン
// if(条件式) { ... } は「もし条件がOKなら…する」
// !（びっくりマーク）は「反対」にするスイッチ
// つまり !isUserLoggedIn は「isUserLoggedIn が false の場合と同じ意味」
if (!isUserLoggedIn) { // !がついているのでisUserLoggedIn が false のとき実行
console.log(" 🚪ログインできていません ");
console.log(" ← 今回は最初に設定した変数 isUserLoggedIn の値が true のため、この if 文は実行されません。");
} else { // それ以外（true）のとき実行
console.log("✅ ログイン済みです！ようこそ 🎉");
console.log(" ← 今回最初に設定した変数 isUserLoggedIn の値が true なので else 文が実行されました。");
console.log(`if 条件式の "!isUserLoggedIn" は "isUserLoggedIn が false" と同じ意味です。今回は false ではないため、else に入りました。`);
}
// 【動作シミュレーション表】
// | isUserLoggedIn の値 | !isUserLoggedIn（条件） | 実行されるブロック | コンソール表示 |
// |---------------------|-------------------------|--------------------|----------------------------------------|
// | true | false | else | ✅ ログイン済みです！ようこそ 🎉 |
// | false | true | if | 🚪 ログインできていません ❌ |
// 【ポイント】
// ・true は「はい / OK」、false は「いいえ / NG」
// ・!true → false、!false → true
// ・if は「もし〜なら」、else は「それ以外なら」
// ===================================
// 🖥 論理演算子（&& と ||）の図解例
// ===================================
// ⚠ 論理演算子は「true（OK）」を基準に考えます。
// false = ダメ ❌
// true = OK ✅
// 【イメージ図】
// &&（どっちもOK＝true？）
// true && true → ✅ OK！
// true && false → ❌ ダメ
// false && true → ❌ ダメ
// false && false → ❌ ダメ
//
// ||（どっちかOK＝true？）
// true || true → ✅ OK！
// true || false → ✅ OK！
// false || true → ✅ OK！
// false || false → ❌ ダメ
//
// !（逆さまにする）
// !true → false
// !false → true
// ---------- &&（どっちもOK＝true？）の例 ----------
let hasTicket = true; // 🎫 チケットを持っている？
let isAdult = false; // 👶 子どもかな？
console.log("🎯 初めの設定 → hasTicket = true（チケットあり）, isAdult = false（子ども）");
// 「チケットも持っていて、なおかつ大人なら入れる」
if (hasTicket && isAdult) {
console.log("🎫 チケットもあって大人だから入れるよ！ ✅");
console.log(" ← 両方 ok = true のときだけ、このメッセージが出ます。");
} else {
console.log("🚪 チケットがないか、子どもだから入れない… ❌");
console.log(" ← どちらかが false だと、このメッセージになります。");
}
// ---------- ||（どっちかOK＝true？）の例 ----------
let ateMeal = false; // 🍚 ごはんを食べた？
let ateSnack = true; // 🍪 お菓子を食べた？
console.log("🎯 初めの設定 → ateMeal = false（ごはんなし）, ateSnack = true（お菓子あり）");
// 「ごはんかお菓子、どっちかでも食べたらお腹OK」
if (ateMeal || ateSnack) {
console.log("🍽 ごはんかお菓子を食べたからお腹は大丈夫！ 😋 ✅");
console.log(" ← どちらかが ok = true なら、このメッセージになります。");
} else {
console.log("🍴 何も食べてないからお腹すいた… 🥺 ❌");
console.log(" ← 両方 false のとき、このメッセージになります。");
}
// 【動作まとめ表】
// (1) &&（どっちもOK＝true？）
// | hasTicket | isAdult | 結果 | 出るメッセージ |
// |-----------|---------|-------|----------------|
// | ✅ | ✅ | ✅ | if の中 |
// | ✅ | ❌ | ❌ | else の中 |
// | ❌ | ✅ | ❌ | else の中 |
// | ❌ | ❌ | ❌ | else の中 |
// (2) ||（どっちかOK＝true？）
// | ateMeal | ateSnack | 結果 | 出るメッセージ |
// |---------|----------|-------|----------------|
// | ✅ | ✅ | ✅ | if の中 |
// | ✅ | ❌ | ✅ | if の中 |
// | ❌ | ✅ | ✅ | if の中 |
// | ❌ | ❌ | ❌ | else の中 |
// 【まとめ】
// ・論理演算子は true（OK）を基準に考えます。
// ・&& → 両方とも ok = true なら ✅
// ・|| → どちらか1つでも ok = true なら ✅
// ・! → 逆さまにする（✅ ⇄ ❌）
// ===================================
// 🖥 ユーザーの役目チェックプログラム
// （if / else if / else の流れ）
// ===================================
// ✅ ここで使う「===」の意味
// 「===」は「同じかどうか？」をチェックする記号です。
// たとえば userRole === "member" は
// 「userRole の中身が 'member' と同じ？」と聞いています。
// 同じなら true（はい！）、ちがえば false（いいえ！）になります。
// 🔍 「===」と「==」のちがい
// ・=== → きびしいチェック（数字か文字かも確認する）
// ・== → ゆるいチェック（数字と文字のちがいを気にしない）
//
// 例：
// 1 === "1" → false（数字と文字はちがうものだから ❌）
// 1 == "1" → true （数字と文字のちがいを無視するから ✅）
//
// プログラムでは「===（きびしいほう）」を使うのが安心です！
// ユーザーの役目を表す定数
// "member" = 社員, "admin" = 管理者, "owner" = 社長
const userRole = "member";
// ↑ 今回は "member" なので、社員のケースになります
// --------------------------------------------------
// if, else if, else の流れ図
// --------------------------------------------------
// 1️⃣ if(条件) → まず最初にここをチェック
// ✅ もし当てはまったら、その中の処理を実行して終了
// 2️⃣ else if(条件) → if が ❌ だったら次にここをチェック
// ✅ ここで当てはまれば、その中の処理を実行して終了
// 3️⃣ else → どれも当てはまらなかったときの保険
// ✅ 必ず実行される（最後の切り札）
// --------------------------------------------------
console.log("=== 条件分岐スタート ===");
if (userRole === "member") {
console.log("👷 社員：アクセスできません ❌");
console.log(` ← userRole が "member" の場合だけ実行（今回は "member" なので実行されます）`);
} else if (userRole === "admin") {
console.log("🛠 管理者：10分だけアクセス可能 ⏳");
console.log(` ← userRole が "admin" の場合だけ実行（今回は "member" なので実行されない）`);
} else {
console.log("👑 社長またはその他：自由にアクセス可能 🎉");
console.log(` ↑ 上のどれにも当てはまらなかったのでここが実行（今回は "member"）`);
}
console.log("=== 条件分岐おわり ===");
// ===================================
// 【動作シミュレーション表】
// ===================================
//
// | userRole の値 | 流れ | 実行される場所 | 出力内容 |
// |---------------|---------------------------------------------|----------------|---------------------------------------|
// | "member" | if が true → そこで終了 | if | 👷 社員：アクセスできません ❌ |
// | "admin" | if が false → else if が true → そこで終了 | else if | 🛠 管理者：10分だけアクセス可能 ⏳ |
// | "owner" | if false → else if false → else 実行 | else | 👑 社長またはその他：自由にアクセス可能 🎉 |
// | "guest" など | if false → else if false → else 実行 | else | 👑 社長またはその他：自由にアクセス可能 🎉 |
//
// ===================================
// 【ポイント】
// ===================================
// ・if → 最初にチェックする条件
// ・else if → if がダメだったときに次に試す条件
// ・else → どれもダメだったら実行する最後の保険
// ・一度当てはまったら下の条件はもう見ない（スキップ！）
// ===================================
// 🖥 発送判定プログラム
// （if 文で条件チェック ＆ 変数の値を変える例）
// ===================================
// ✅ まずは使う言葉の説明
// ・true（ほんとう） → 条件に当てはまるときの状態
// ・false（うそ） → 条件に当てはまらないときの状態
// ・if(条件) { } → 「もし 条件 が true なら { } の中を実行する」
// ・>= → 「以上」（左が右と同じか、それより大きいなら true）
// --------------------------------------------------
// 変数と定数のちがい
// --------------------------------------------------
// ・let で作る「変数」 → あとから中身を変えられる（再代入できる）
// ・const で作る「定数」 → 中身を変えられない（固定のまま）
// --------------------------------------------------
// --------------------------------------------------
// 💡 初期状態を表示（まず確認）
// --------------------------------------------------
console.log("=== 💡 初期状態を確認します ===");
// 発送するかどうかを表す変数
let isShipping = false;
console.log("🔹 isShipping = false （発送しない状態）");
// お財布のお金を表す定数
const myMoney = 1000;
console.log("🔹 myMoney = 1000 円");
// --------------------------------------------------
// 📦 判定スタート！
// --------------------------------------------------
console.log("=== 📦 発送判定プログラムのスタート ===");
console.log("続きです 👉 お金が 500円以上あるかどうかをチェックします。");
// 条件：お金が500円以上あるか？
if (myMoney >= 500) {
isShipping = true; // false → true に変更
console.log("💰 判定結果 → 500円以上あるので発送することにしました！ 🚚✨ （false から true に書き換えた）");
} else {
console.log("💸 判定結果 → お金が足りないので今回は発送できません… 🙅♂️");
}
// ===================================
// 【動作シミュレーション表】
// ===================================
//
// | myMoney の値 | 判定 (myMoney >= 500) | isShipping の最終値 |
// |--------------|-----------------------|---------------------|
// | 1000 | true （500以上） | true （発送する） |
// | 500 | true （500ちょうど） | true （発送する） |
// | 499 | false（500未満） | false （発送しない）|
//
// ===================================
// 【ポイントまとめ】
// ===================================
// ・let で作った変数はあとから変えられる
// ・const で作った定数は変えられない
// ・if(条件) { … } は「もし 条件 が true なら 中の処理を実行する」
// ・>= は「以上」（同じでもOK、それ以上でもOK）