164. Immerのproduce()を実装してください

少し工夫が必要  - accepted / - tried

Immutability helperを実装するでは、 いろんなimmutability helpersの実装が求められる。

けれども使い方を覚えないといけない。 Immer では違うアプローチをとってもっと使いやすくすることができる。

例えば、下記のstateがあるとする。

const state = [
  {
    name: 'BFE',
  },
  {
    name: '.',
  }
]

produce()を使えば思うようにstateを変更することができる。

const newState = produce(state, draft => {
  draft.push({name: 'dev'})
  draft[0].name = 'bigfrontend'
  draft[1].name = '.' // 同じ値をsetする
})

変わらないパーツはそのまま。

expect(newState).not.toBe(state);
expect(newState).toEqual(
  [
    {
      name: 'bigfrontend',
    },
    {
      name: '.',
    },
    {
      name: 'dev'
    }
  ]
);
expect(newState[0]).not.toBe(state[0])
expect(newState[1]).toBe(state[1])
expect(newState[2]).not.toBe(state[2])

produce()を実装してください.

  1. Immerを完全に実装することではない、test caseは完全ではない
  2. plain object と arrayの基本ケースをカバーすれば良い、Map/SetやAuto freezingなどは気にしなくて良い。
  3. 変わらないパーツはそのままでcloneしないでください。

バッグフリーで普通なコードは何より。

(9)