BFE.devでのAI解答例 - JavaScript コーディング問題
12. Immutability helperを実装する

以下はJavaScriptで実装したImmutability Helperの例です。

function update(obj, spec) {
  if (spec.$push) {
    return [...obj, ...spec.$push]
  } else if (spec.$set !== undefined) {
    return spec.$set
  } else if (spec.$merge) {
    return {...obj, ...spec.$merge}
  } else if (spec.$apply) {
    return spec.$apply(obj)
  } else if (Array.isArray(obj)) {
    return obj.map((item, index) => {
      if (index in spec) {
        return update(item, spec[index])
      } else {
        return item
      }
    })
  } else {
    let newObj = {}
    for (let key in obj) {
      if (key in spec) {
        newObj[key] = update(obj[key], spec[key])
      } else {
        newObj[key] = obj[key]
      }
    }
    return newObj
  }
}

このImmutability Helperは、与えたオブジェクトと変更内容のspecを受け取り、変更を加えた新しいオブジェクトを返します。実装の詳細は次のとおりです。

まず、$pushがある場合は、配列の要素をオブジェクト全体を展開することで追加します。

if (spec.$push) {
  return [...obj, ...spec.$push]
}

次に、$setがある場合は、単純に$setで指定された値を返します。

else if (spec.$set !== undefined) {
  return spec.$set
}

$mergeがある場合は、スプレッド演算子を使用して新しいオブジェクトを生成します。

else if (spec.$merge) {
  return {...obj, ...spec.$merge}
}

$applyがある場合は、関数を適用して新しいオブジェクトを返します。

else if (spec.$apply) {
  return spec.$apply(obj)
}

次に、配列の場合は、各要素に再帰的にupdate関数を適用し、変更がある場合はその要素を新しいオブジェクトに含めます。

else if (Array.isArray(obj)) {
  return obj.map((item, index) => {
    if (index in spec) {
      return update(item, spec[index])
    } else {
      return item
    }
  })
}

最後に、オブジェクトの場合は、各キーに再帰的にupdate関数を適用し、変更がある場合はそのキーと値を新しいオブジェクトに含めます。

else {
  let newObj = {}
  for (let key in obj) {
    if (key in spec) {
      newObj[key] = update(obj[key], spec[key])
    } else {
      newObj[key] = obj[key]
    }
  }
  return newObj
}