无法深度克隆[重复]答案

【问题标题】：Unable to deep clone [duplicate]无法深度克隆[重复]
【发布时间】：2021-06-14 15:05:25
【问题描述】：

我想复制一个对象。
之后，我计划修改副本中的值，但这些
修改不应影响原始对象。

因此我想制作一个克隆，目前使用 lodash 的 deepClone。

但它一直抛出以下错误：

错误！Object(...) 不是函数

我的对象中没有函数。它只是在以下结构中。
它们只是键值，值可以是字符串或布尔值。

const myOriginalObject {
    mainKey : {
        isMobile: true,
        data: {
            id: '',
            header: '',
            flag: '',
            desc1: '',
            desc2: '',
            logo: {
                src: '',
                alt: '',
            },
            img: {
                src: '',
                alt: '',
            },
        }
    }
}

只是为了测试它创建了一个随机对象，如下所示。
即使这样也会引发同样的错误。

  const myOriginalObject = {
    b: '',
    c: ''
  }

这是深度复制的实现。 myOriginalObject 可以是上述对象之一。

import { cloneDeep } from 'lodash/cloneDeep';

const myClone = cloneDeep(myOriginalObject);

我做错了什么？请建议。谢谢。

更新：

我来自 package.json 的 lodash 版本

"lodash": "^4.17.20",

错误：

render 出错：TypeError: Object(...) is not a function

【问题讨论】：

这并不是说你的对象中有一个函数。请包含 complete 错误和 package.json 的 lodash 部分。这就是cloneDeep 的使用方式，因此错误可能来自其他地方，或者存在打包/导入/导出问题。（注意您的第一个示例不是有效的 JS。）
@DaveNewton 更新了上面的版本。错误明智的没有太多其他的。只是说render有一个错误和前面提到的错误。
import { cloneDeep } from 'lodash/cloneDeep' -> import cloneDeep from 'lodash/cloneDeep' 因为您是直接导入，所以无需导入单个零件。您的另一个选项是import { cloneDeep } from 'lodash'，但我建议您使用第一个。
@VLAZ 不确定发生了什么魔法。切换到从 'lodash' 导入 cloneDeep 现在可以工作了。谢谢。
@Fllappy import { cloneDeep } 将导入名为cloneDeep 的命名导出。 import cloneDeep 将导入 默认导出 并为其指定 cloneDeep 名称。 'lodash/cloneDeep' 模块仅将单个函数导出为默认导出。这就是为什么使用 import { cloneDeep } 不起作用的原因 - 没有所谓的 named 导出。 'lodash/someFunction' 包可以让你只一个一个地导入东西。 import { cloneDeep } from 'lodash' 将加载整个 lodash 模块，然后只从中获取cloneDeep。太浪费了。

标签： javascript lodash

【解决方案1】：

你可以这样做：

import { cloneDeep } from 'lodash'; // <= Notice import method

const myOriginalObject = { a: '', b: ''};

const myClonedObj = cloneDeep(someObj);

或者：

import _ from 'lodash'; // <= Notice import method

const myOriginalObject = { a: '', b: ''};

const myClonedObj = _.cloneDeep(someObj);

似乎从'lodash/cloneDeep' 导入不起作用（但我不知道为什么）。

[可能是cloneDeep 在_ 中的完整实现使用不同的目录，但同样不确定。]

【讨论】：

"似乎从 'lodash/cloneDeep' 导入不起作用" 如果您使用 import cloneDeep from 'lodash'（导入默认导出），它应该可以正常工作。见How to Import a Single Lodash Function? 和Correct way to import lodash

【解决方案2】：

试试这个

const myOriginalObject {
    mainKey : {
        isMobile: true,
        data: {
            id: '',
            header: '',
            flag: '',
            desc1: '',
            desc2: '',
            logo: {
                src: '',
                alt: '',
            },
            img: {
                src: '',
                alt: '',
            },
        }
    }
}

const newObj = JSON.parse(JSON.stringify(myOriginalObject));

现在对 newObj 进行任何更改，它不会反映到 myOriginalObject；

【讨论】：