javascript - map 是否有可能改变对象？

Question

我有一个非常奇怪的案例，它表明 ma​​p 函数改变对象 或 lodash 错误地克隆了对象。这段代码只是一个示例:一个函数将一个对象作为参数，并使用来自 lodash 的 cloneDeep 返回它的副本。然后我使用这个对象生成图表。

const copyObject = data => {
  const copy = _.cloneDeep(data);

  const dataWithIndexes = copy.nodes.map((node, index) => {
    node.index = index;
    return node;
  });

  return copy;
};

export const copiedData = copyObject(sampleData);

本例中的条目数据是一个包含对象数组的对象:

{
  nodes: [
    { name: "transactions.main", layer: 0 },
    ...
  ],
  links: [
    { source: 3, target: 3, value: 4 },
    ...
  ]
}

如您所见，根本没有使用 map inside 函数，这就是重点。当我在我的图表生成函数中使用原始的、未修改的对象时它工作正常，当我用上面显示的函数复制对象时，它不起作用，但是当我评论这个 dataWithIndexes 变量时它开始再次工作。 map 是否有可能以任何方式改变复制的对象？或者这可能是 lodash 的错？它可能会错误地克隆对象，但另一方面，我只使用它上面的 map ，它不会以任何方式修改它。

也许谁能帮我解开这个谜题T_T

谢谢

Answer 1

您正在修改 map(...) 回调中的 node 对象参数，方法是覆盖其 index 属性:node .index = 索引。这样，尽管它返回一个新数组，但数组中的原始对象会发生变化。

即使您没有使用 dataWithIndexes 这仍然会发生，这是因为 map(...) 仍在运行并且当它运行时它会改变对象在 copy.node 数组中包含回调中 index 的新值。

为避免这种情况，在 map 调用中复制 node 对象参数并在其中分配新的 index，然后从回调中返回它:

const dataWithIndexes = copy.nodes.map((node, index) => {
    return {...node, index};
});