javascript - 使用 immer 在 JavaScript 中复制对象

Question

我正在使用 immer转换 react/redux 状态。我还可以使用 immer 只深度复制一个对象而不对其进行转换吗？

import produce, {nothing} from "immer"



const state = {
    hello: "world"
}

produce(state, draft => {})
produce(state, draft => undefined)
// Both return the original state: { hello: "world"}

这是来自官方的 immer README。这是否意味着将空函数传递给 produce 会返回原始状态的深拷贝或实际上是原始状态？

非常感谢您的帮助:)!

Answer 1

这很容易测试

import { produce } from 'immer'

const state = {
  hello: 'world',
}

const nextState = produce(state, draft => {})

nextState.hello = 'new world'
console.log(state, nextState)

哪些输出

Object { hello: "new world" }

Object { hello: "new world" }

这意味着它不会创建对象的深拷贝。

更新:

所以我对此产生了兴趣并对该库进行了大量测试，这是我的发现。

我上面写的代码片段只是库中的一个优化，如果不做任何更改，它会返回旧状态。但是，如果您进行了一些更改，那么该库将开始按预期运行，并且以后无法进行更改。也就是说，

const state = {
  hello: 'world',
}

const nextState = produce(state, draft => {
  draft.hello = 'new world';
})

nextState.hello = 'newer world';

console.log(state, nextState)

将导致错误:TypeError: "world"is read-only

这意味着您的 newState 是不可变的，您不能再对其执行更改。

我发现的另一个相当有趣的事情是，immer 在使用 class 实例时会失败。也就是说，

class Cls {
  prop = 10;
}

const instance = new Cls();

const obj = {
  r: instance,
};

const newObj = produce(obj, draft => {
  draft.r.prop = 15;
});

console.log(obj, newObj);

结果

r: Object { prop: 15 }

r: Object { prop: 15 }

---

所以回到最初的问题，你能否通过不改变草稿中的任何内容来获得初始对象的深拷贝。不，你不能，即使你这样做了(通过更改一个可能只是为了愚弄 immer 而创建的属性)，生成的克隆对象将是不可变的并且没有真正帮助。