純粋関数を「どこまで」適用すべきか
フロントエンド開発において、純粋関数(Pure Function)の重要性は語り尽くされています。しかし、実務の現場では、すべてのロジックを純粋関数にしようとして疲弊するケースも少なくありません。私が推奨するのは、「計算ロジック」と「副作用(API通信やDOM操作)」を明確に分離するというアプローチです。Reactのコンポーネント内やカスタムフックの中で、複雑な条件分岐を直接書くのではなく、単体テストが容易な純粋関数として抽出するだけで、コードの堅牢性は劇的に向上します。
実務で見落としがちな「非純粋」の罠
純粋関数の定義は「同じ引数に対して常に同じ値を返し、副作用を持たないこと」です。ここで多くのエンジニアが陥る罠が、Date.now() や Math.random() を関数内で直接使用してしまうことです。これらは実行するたびに結果が変わるため、純粋関数とは呼べません。実務では、こうした値を引数として外部から注入(Dependency Injection)する設計にすることで、テスト時に固定値を渡せるようになり、カバレッジを100%に保つことが容易になります。
状態管理との付き合い方
ReduxやZustandなどの状態管理ライブラリを利用している場合、Reducerは純粋関数であることが強制されます。しかし、その外側の「APIレスポンスの整形処理」などは、純粋関数として切り出されていないことが多いです。例えば、サーバーから受け取った複雑なJSONをUI用に変換する処理を、コンポーネントの外側に純粋関数として定義してみてください。それだけで、APIの仕様変更時にフロントエンドが壊れるリスクを最小限に抑えられます。
結論:純粋関数は「設計の羅針盤」
純粋関数は、単なるプログラミングのテクニックではなく、「どこが壊れやすい場所なのか」を可視化するツールです。副作用のある場所を「外側の薄い層」に追いやり、ビジネスロジックを「純粋な層」に閉じ込める。この意識を持つだけで、大規模なアプリケーションでも、修正時の恐怖心を大幅に減らすことができます。まずは、現在書いている関数のうち、戻り値が引数だけに依存しているものを一つ見つけ出し、別のファイルに切り出すことから始めてみてください。