React入門 練習問題 14：Reactの基本概念：コンポーネントの命名規則
Reactで関数コンポーネントを定義する際の命名規則として正しいものはどれか。
- コンポーネント名は必ず大文字で始める必要があり、小文字で始めるとJSX内でHTML標準タグとして解釈されてしまう
- コンポーネント名は必ず小文字で始める必要があり、大文字で始めるとブラウザがエラーを出して表示されなくなる
- コンポーネント名の先頭文字に制限はなく、大文字・小文字どちらで始めても常に同じ結果になる
- コンポーネント名は必ずUseという接頭辞を付ける必要があり、それ以外の名前は認識されない
- コンポーネント名は必ずファイル名と完全に一致させる必要があり、異なる場合はビルドエラーになる
正解と解説を見る
正解：コンポーネント名は必ず大文字で始める必要があり、小文字で始めるとJSX内でHTML標準タグとして解釈されてしまう
ReactではJSX内で小文字始まりのタグは標準HTML要素、大文字始まりのタグはカスタムコンポーネントとして解釈されるため、コンポーネント名は必ず大文字で始める必要があります。
【正解の理由】
この規則に従わないと、Reactは自作のコンポーネントをHTMLタグとして誤解釈し、正しく表示されません。
【不正解の理由】
• 「小文字で始める必要があり、大文字で始めるとブラウザがエラーを出す」という説明は誤り。実際には逆で、大文字始まりが正しい規則である
• 「先頭文字に制限はなく、常に同じ結果になる」という説明は誤り。先頭文字によって解釈が変わるため制限が存在する
• 「Useという接頭辞を付ける必要がある」という説明は誤り。Use接頭辞はカスタムフックの命名規則であり、コンポーネントの規則ではない
• 「ファイル名と完全に一致させる必要がある」という説明は誤り。Reactの仕様上、ファイル名とコンポーネント名の一致は必須ではない