React入門 練習問題 5：条件付きレンダリング
Reactの条件付きレンダリングで次のコードがある場合、画面表示はどうなりますか？
```jsx
const [isLoggedIn, setIsLoggedIn] = useState(false);
return (
<div>
{isLoggedIn && <p>ようこそ</p>}
</div>
);```
- 「ようこそ」が表示される
- 「false」が表示される
- 何も表示されない
- エラーが発生する
- 「0」が表示される
Qraftユーザーの成績：難易度 Dランク（レーティング1146）・正答率 69%（22/32回正解）
レーティングは解いた人の実力と正誤から算出する難しさ（初期値1200）。ランクはその全問題中の順位（S+が最難関、F-が最易）
正解と解説を見る
正解：何も表示されない
`isLoggedIn`が`false`のとき、`{isLoggedIn && <p>ようこそ</p>}`は画面に何も表示しません。
【正解の理由】
論理AND演算子は左辺が`false`だと右辺を評価せず`false`を返す（短絡評価）性質があり、JSXは`false`・`null`・`undefined`・`true`を画面に描画しない仕様のため、結果的に何も表示されません。
【不正解の理由】
• 「ようこそ」が表示される：`isLoggedIn`が`false`なので条件を満たさず、右側の`<p>ようこそ</p>`は評価されない。
• 「false」が表示される：演算結果は`false`だが、JSXは真偽値をそのまま文字として描画しない。
• エラーが発生する：構文的に正しいコードのためエラーにはならない。
• 「0」が表示される：数値の`0`はJSXに描画されてしまう例外があるが、今回の値は`false`（真偽値）であり`0`ではないため、この状況では起こらない。