React基礎・実践 問題集

Reactでコンポーネントの状態を管理するために使用するHookは？

Reactで副作用（side effects）を処理するために使用するHookは？

Reactでコンポーネントを最適化し、不要な再レンダリングを防ぐために使用するHookは？

Reactの標準機能として間違っているものは？

Reactで条件付きレンダリングを行う際の正しい構文は？

Reactでリストをレンダリングする際に必要なプロパティは？

ReactでカスタムHookを作成する際の命名規則は？

Reactでフォームの入力値をstateで管理するコンポーネントの種類は？

Reactでパフォーマンス最適化のために使用できる高階コンポーネントは？

Reactでルーティングを実装するために一般的に使用されるライブラリは？

ReactでDOM要素への参照を保持するために使用するHookは？

useEffectでクリーンアップ関数を返す目的は？

useEffectの依存配列を空配列[]にした場合の動作は？

Reactでpropsの型チェックを行うために使用するライブラリは？

Reactでコンポーネントツリー全体でデータを共有する標準機能は？

useMemo(() => 重い計算()) と書いて依存配列を省略した。どうなる？

次のReactコンポーネントで、useCallbackを使う意味が最もあるのはどのケースですか？

関数コンポーネントでライフサイクルメソッドの代わりに使用するのは？

JSXでクラス名を指定する属性は？

Reactでイベントハンドラを定義する際の正しい命名規則は？

Reactで複数の要素をラップせずに返す方法は？

React Hooksの使用に関するルールとして正しいのは？

Reactでpropsを展開して渡す構文は？

Reactの状態更新はどのように動作するか？

setCount(count + 1) を1つのハンドラ内で2回呼んだ。countはいくつ増える？

Reactで子コンポーネントのエラーをキャッチする機能は？

ReactでDOMツリーの外側にコンポーネントをレンダリングする機能は？

Reactでコンポーネントの遅延読み込みを実装する組み合わせは？

Reactで高階コンポーネント（HOC）の特徴は？

ReactのRender Propsパターンの特徴は？

React.StrictModeの主な目的は？

useEffectで無限ループが発生する原因は？

Reactでリストのkeyに配列のインデックスを使用する問題点は？

React 18のConcurrent Featuresの主な利点は？

React Server Componentsの主な特徴は？

React Testing Libraryの推奨されるテスト方法は？

Reactでパフォーマンスを測定するために使用するコンポーネントは？

Reactでハイドレーションエラーが発生する主な原因は？

React.forwardRefの主な用途は？

親コンポーネントから子コンポーネントのテンプレートの一部を差し込む機能は？

以下のコードを実行すると「Rendered more hooks than during the previous render」というエラーが発生します。原因として正しいものはどれですか？ function UserProfile({ isLoggedIn }) { if (isLoggedIn) { const [name, setName] = useState(''); } const [age, setAge] = useState(0); return <div>{age}</div>; }

ESLintプラグイン eslint-plugin-react-hooks の rules-of-hooks ルールが違反を報告するケースとして、正しいものはどれですか？

以下の React コンポーネントで useCallback を使っています。handleClick 関数が新しい参照として再生成されるのはどのタイミングですか？ const Parent = () => { const [count, setCount] = useState(0); const [name, setName] = useState(''); const handleClick = useCallback(() => { setCount(c => c + 1); }, []); return ( <> <input onChange={e => setName(e.target.value)} /> <Child onClick={handleClick} /> </> ); };

次のコンポーネントのボタンをクリックしたとき、画面に表示されるカウントの挙動として正しいものはどれですか？ <pre><code>function Counter() { const count = useRef(0); return ( <button onClick={() => { count.current++; console.log(count.current); }}> count: {count.current} </button> ); }</code></pre>

次のコードを実行したとき、console.log の出力として正しいものはどれですか？ const params = new URLSearchParams('tag=js&tag=ts&tag=react'); console.log(params.get('tag'));

コンポーネントが再レンダリングされたとき、useRefの値はリセットされる？

useRefで作った値は、どのプロパティに保存されている？

Reactで「マウント」が起きるのはどのタイミング？