この教材では、ボタンを押すと条件が切り替わり、リアルタイムで if の判定結果が表示されるようにします 。
See the Pen Multiple conditions (AND / OR / ?? ) by MONO365 -Color your days- (@monoqlo365) on CodePen.
仕様
- 各条件（年齢 / 会員 / ログイン / 同意 / ニックネーム）をボタンで切り替え。
- 判定ロジックを JavaScript でリアルタイムに再計算。
- 判定結果を画面中央に色付きで表示。
- 見やすくモダンなUI（スマホ対応）。
使い方（学習ポイント）
| 条件 | 操作例 | 学べること |
|---|---|---|
| 年齢 | 16 ↔ 20 | 比較演算子 < と >= の動き |
| 会員 / ログイン | ❌↔✅ | &&（AND）条件 |
| 保護者同意 | ❌↔✅ | ` |
| ニックネーム | null → 空文字 → 名前 | ??（Nullish合体） の挙動 |
See the Pen Multiple conditions (AND / OR / ?? ) by MONO365 -Color your days- (@monoqlo365) on CodePen.
