今日の参考コード

Reducer の実装の際に Switch が出てくるので軽く説明します。

if と switch は似ている

switch も if も「ある値が特定の条件を満たしているか」をチェックして、満たした時に何かを実行するという点は非常に似ています。例えば、以下は入力された動物の名前を判定して、鳴き声を返す関数を「if, switch」のそれぞれを使って実装したものです。

// if で実装したら
const ifNakigoe = animal => {
  if (animal === "犬") {
    return "ワン";
  }

  if (animal === "猫") {
    return "ニャー";
  }

  if (animal === "鳥") {
    return "ピヨ";
  }

  return "知らん";
};

// switch で実装したら
const nakigoe = animal => {
  switch (animal) {
    case "犬":
      return "ワン";
    case "猫":
      return "ニャー";
    case "鳥":
      return "ピヨ";
    default:
      return "知らん";
  }
};

考え方はどちらも非常に似ていますね。

switch の特徴

switch と if を比べると、switch の場合には、常にチェックしている対象が同じという特徴があります。以下の例の switch を使った場合には、常に animal がどんな値なのかをチェックしていますよね。

しかし、if を使った場合には、当然ですが animal === 何か というパターン 以外 を含ませることが原理的には可能です。以下の if を使った例では if (animal.length > 3) という条件を追加してみました。このように比較対象が突然変わる、というパターンは if にはできても、switch にはできません。

const nakigoe = animal => {
  switch (animal) {
    case "犬":
      return "ワン";
    case "猫":
      return "ニャー";
    case "鳥":
      return "ピヨ";
    default:
      return "知らん";
  }
};

// 参考 if で実装したら
const ifNakigoe = animal => {
  if (animal === "犬") {
    return "ワン";
  }

  // ここだけちょっと変わり種
  if (animal.length === 3) {
    return "3 文字や！";
  }

  if (animal === "鳥") {
    return "ピヨ";
  }
  
  return "知らん";
};

switch と if のどちらを使うべきか

今回の鳴き声メソッドは、switch でも if でもどちらでも実装することが可能でした。では、どちらを使った方がいいのでしょうか？

一般的には、switch の方が機能的にできることが少ないので、switch で実装できるのであれば switch を使った方がいいでしょう。特に今回のようなケースであれば、switch が使われ、比較対象が animal であることが示された時点で、読んでいる方は考えなくてはいけないことが非常に少なくなるので、楽です。

もし if がズラーっと並んでいると、全ての比較条件をチェックしなくてはいけませんので、switch の場合よりも頭を使う必要があります。if の内容を全部読んで最後までいって初めて、なんだ！animal を比較しているだけじゃないか！とわかります。

比較対象がたった一つしかないことを、最後まで読まないとわからないよりは、早めにわかった方が親切です。そういう意味では switch は有利です。

コードを書く時のポイントの一つは、読んだ時に頭をいかに使わないで理解できるものか、ということです。色々チャレンジしてみてください。

宿題

• switch 用いて、返す値が分岐する関数を実装する
• 上記の関数と同じ内容になる if を使った関数を実装する

今日は以上です〜。