在JavaScript中深度克隆对象的最有效方法是什么？

Question

克隆JavaScript对象最有效的方法是什么？我看到了obj=eval（uneval（o））；正在使用，但这是非标准的，只有Firefox支持.

我做过这样的事情obj=JSON.parse（JSON.stringify（o））；但对效率提出质疑。

我还看到递归复制函数有各种缺陷。
我很惊讶没有规范的解决方案。

Answer 1

本机深度克隆

现在有一个structuredClone（值）所有主要浏览器和节点支持的函数>=17。它有旧系统的聚合物填充.

structuredClone（值）

如果需要，请先加载聚合物填料：

从“@ungap/structured-clone”导入structuredClone；

请参见这个答案了解更多详细信息，但是注意这些限制:

• 结构化克隆算法不能复制功能对象；试图引发DataCloneError异常。
• 克隆DOM节点同样会引发DataCloneError异常。
• 某些对象属性不会保留：
  • RegExp对象的lastIndex属性未保留。
  • 属性描述符、setter、getter和类似元数据的功能不会重复。例如，如果一个对象用属性描述符标记为只读，那么它将在副本中读/写，因为这是默认的。
  • 原型链未漫游或复制。

更早的答案

快速克隆并丢失数据-JSON.parse/stringify

如果您不使用日期s、 功能，未定义,无穷、RegExps、Maps、Sets、Blob、FileLists、ImageData、稀疏数组、类型化数组或对象中的其他复杂类型，深度克隆对象的一个非常简单的一行程序是：

JSON.parse（JSON.stringfy（对象））

常数a={string:'字符串'，编号：123，bool：错误，nul：空，date:new date（），//字符串化undef：未定义，//丢失inf:无限，//强制为“null”回复：/.*/，//丢失}控制台.log（a）；console.log（日期类型）；//Date对象const clone=JSON.parse（JSON.stringify（a））；console.log（克隆）；console.log（clone.date类型）；//.toISOString（）的结果

请参见科尔班的回答用于基准。

使用库进行可靠的克隆

由于克隆对象并不简单（复杂类型、循环引用、函数等），大多数主要库都提供了克隆对象的功能。轮子-如果您已经在使用库，请检查它是否具有对象克隆功能。例如，

• 火山灰-克隆深度; 可以通过单独导入lodash.clonedep公司如果您还没有使用提供深度克隆功能的库，那么它可能是您的最佳选择
• 兰达-克隆
• 安格拉尔JS-角度复制
• jQuery公司-jQuery.extend（true，{}，oldObject）;.clone（）仅克隆DOM元素
• 只是图书馆-单克隆; 零依赖npm模块库的一部分，只做一件事。在任何场合都可以使用免费的公用设施。

Answer 2

检查此基准：http://jsben.ch/#/bWfk9网址

在我之前的测试中，我发现速度是一个主要问题

JSON.parse（JSON.stringify（obj））

深度克隆对象的最慢方式（比jQuery.扩展具有深的标志设置为真（10-20%）。

当深的标志设置为假（浅克隆）。这是一个很好的选择，因为它包含一些额外的类型验证逻辑，并且不会复制未定义的属性等，但这也会让您慢一点。

如果您知道要克隆的对象的结构，或者可以避免深层嵌套数组，那么可以编写一个简单的for（obj中的var i）循环来克隆对象，同时检查hasOwnProperty，这将比jQuery快得多。

最后，如果您试图在热循环中克隆已知的对象结构，只需将克隆过程内联并手动构建对象，就可以获得更高的性能。

JavaScript跟踪引擎擅长优化用于。。在里面循环和检查hasOwnProperty也会减慢速度。当速度绝对必要时，手动克隆。

var克隆对象={knownPrep:对象.knownProp，..}

小心使用JSON.parse（JSON.stringify（obj））上的方法日期对象-JSON.stringfy（新日期（））以ISO格式返回日期的字符串表示形式JSON.parse（） 不转换回日期对象。有关更多详细信息，请参阅此答案.

此外，请注意，至少在Chrome 65中，本机克隆不是一条出路。根据JSPerf，通过创建新函数来执行本机克隆几乎800倍比使用JSON.stringify慢，JSON.stringify在所有方面都快得令人难以置信。

ES6更新

如果您使用的是Javascript ES6，请尝试使用此本机方法进行克隆或浅层复制。

赋值对象（{}，obj）；

Answer 3

结构化克隆

2022年更新：这个结构化克隆全局函数已在Firefox 94、Node 17和Deno 1.14中提供

HTML标准包括一种内部结构化克隆/序列化算法可以创建对象的深度克隆。它仍然局限于某些内置类型，但除了JSON支持的少数类型外，它还支持Dates、RegExp、Maps、Sets、Blobs、FileLists、ImageData、sparse Arrays、Typed Arrays，将来可能还会支持更多类型。它还保留了克隆数据中的引用，允许它支持会导致JSON错误的循环和递归结构。

Node.js中的支持：

这个结构化克隆全局函数由节点17.0提供：

const clone=structuredClone（原始）；

早期版本：第8版Node.js中的模块（自节点11起）直接公开结构化序列化API，但此功能仍被标记为“实验性”，并可能在未来版本中进行更改或删除。如果您使用的是兼容版本，克隆对象非常简单：

const v8=要求（“v8”）；const structuredClone=obj=>{返回v8.deserialize（v8.serialize（obj））；};

浏览器中的直接支持：Firefox 94中提供

这个结构化克隆全局函数将很快由所有主要浏览器提供（之前在GitHub上的whatwg/html#793). 它看起来/将看起来像这样：

const clone=structuredClone（原始）；

在发布之前，浏览器的结构化克隆实现只能间接公开。

异步解决方法：可用。😕

使用现有API创建结构化克隆的低开销方法是通过消息频道。另一个端口将发出消息事件的结构化克隆.数据不幸的是，监听这些事件必然是异步的，而同步替代方案则不太实用。

类StructuredCloner{构造函数（）{this.pendingClones _=新映射（）；this.netKey=0；const通道=新消息通道（）；this.inPort _=通道端口1；this.outPort _=通道端口2；this.outPort_.onmessage=（{data:{key，value}}）=>{const resolve=this.pendingClones_.get（密钥）；解析（值）；this.pendingClones_.delete（密钥）；};this.outPort_.start（）；}克隆异步（值）{return new Promise（解决=>{const键=this.nextKey_++；this.pendingClones_.set（key，resolve）；this.inPort_.postMessage（{key，value}）；});}}const structuredCloneAsync=窗口结构化克隆异步=StructuredCloner.prototype.cloneAsync.bind（新Structured Cloner）；

示例使用：

constmain=async（）=>{const-original={date:new-date（），number:Math.random（）}；original.self=原始；const clone=等待structuredCloneAsync（原始）；//它们是不同的对象：console.assert（原始！==克隆）；console.assert（原始日期！==克隆日期）；//它们是周期性的：console.assert（original.self===原始）；console.assert（clone.self===克隆）；//它们包含等效值：console.assert（original.number===clone.number）；console.assert（数字（original.date）===数字（clone.date，克隆日期））；console.log（“断言完成”）；};main（）；

同步解决方案：太棒了！🤢

同步创建结构化克隆没有好的选项。这里有一些不切实际的破解。

history.pushState（）和历史记录.replaceState（）两者都创建了第一个参数的结构化克隆，并将该值赋给历史.状态。您可以使用此选项创建任何对象的结构化克隆，如下所示：

const structuredClone=obj=>{const oldState=历史记录状态；history.replaceState（obj，null）；const clonedObj=历史记录状态；history.replaceState（oldState，null）；return clonedObj；};

使用示例：

'使用严格'；常量main=（）=>{const original=｛date:new date（），number:Math.random（）｝；original.self=原始；const clone=structuredClone（原始）；//它们是不同的对象：console.assert（原始！==克隆）；console.assert（original.date！==clone.date）；//它们是周期性的：console.assert（original.self===原始）；console.assert（克隆自我===克隆）；//它们包含等效值：console.assert（original.number===clone.number）；console.assert（数字（original.date）===数字（clone.date，克隆日期））；console.log（“断言完成”）；};const structuredClone=obj=>{const oldState=历史记录状态；history.replaceState（obj，null）；const clonedObj=历史记录状态；history.replaceState（oldState，null）；return clonedObj；};main（）；

虽然是同步的，但速度可能非常慢。它会带来与操作浏览器历史记录相关的所有开销。重复调用此方法可能会导致Chrome暂时无响应。

这个通知建造师创建关联数据的结构化克隆。它还尝试向用户显示浏览器通知，但除非您请求通知权限，否则这将自动失败。如果您有其他用途的权限，我们将立即关闭我们创建的通知。

const structuredClone=obj=>{const n=新通知（“”，{data:obj，silent:true}）；n.onshow=n.close.bind（n）；返回n.data；};

使用示例：

'使用严格'；常量main=（）=>{const-original={date:new-date（），number:Math.random（）}；original.self=原始；const clone=structuredClone（原始）；//它们是不同的对象：console.assert（原始！==克隆）；console.assert（原始日期！==克隆日期）；//它们是周期性的：console.assert（original.self===原始）；console.assert（clone.self===克隆）；//它们包含等效值：console.assert（original.number===clone.number）；console.assert（数字（original.date）===数字（clone.date，克隆日期））；console.log（“断言完成”）；};常量结构克隆=obj=>{const n=新通知（“”，{data:obj，silent:true}）；n.关闭（）；返回n.data；};main（）；

Answer 4

假设对象中只有属性而没有任何函数，则可以使用：

var newObject=JSON.parse（JSON.stringify（oldObject））；

Answer 5

如果没有内置的，您可以尝试：

功能克隆（obj）{if（obj===null||typeof（obj）！=='obj中的对象“||”isActiveClone）返回对象；if（obj实例日期）var temp=新对象构造函数（）//或新日期（obj）；其他的var temp=对象构造函数（）；for（obj中的var键）{if（Object.prototype.hasOwnProperty.call（obj，key））{obj['isActiveClone']=空；temp[key]=克隆（obj[key]）；删除对象['isActiveClone']；}}返回温度；}

Answer 6

在一行代码中克隆（而不是深度克隆）对象的有效方法

安对象分配该方法是ECMAScript 2015（ES6）标准的一部分，可以满足您的需要。

var clone=Object.assign（{}，obj）；

assign（）方法用于将所有可枚举自身属性的值从一个或多个源对象复制到目标对象。

阅读更多。。。

这个聚乙烯填料要支持较旧的浏览器：

if（！Object.assign）{Object.defineProperty（对象，“assign”{可枚举：false，可配置：true，可写：true，值：函数（目标）{'使用严格'；if（目标===未定义||目标===null）{throw new TypeError（“无法将第一个参数转换为对象”）；}var to=对象（目标）；for（var i=1；i<参数长度；i++）{var nextSource=参数[i]；if（nextSource===未定义||nextSource===空）{继续；}nextSource=对象（nextSource）；var keysArray=Object.keys（nextSource）；for（var nextIndex=0，len=keysArray.length；nextIndex<len；next Index++）{var nextKey=keysArray[nextIndex]；var desc=Object.getOwnPropertyDescriptor（nextSource，nextKey）；if（desc！==未定义&&desc.enumerable）{to[nextKey]=nextSource[nexdKey]；}}}返回；}});}

Answer 7

按性能进行深度复制：

根据基准从最好到最差进行排名
https://www.measurethat.net/Bechmarks/Show/17502/0/deep-copy-comparison网站

• 扩散算子...（基元数组-仅限）
• 切片（）（基元数组-仅限）
• 拼接（0）（基元数组-仅限）
• concat（）（基元数组-仅限）
• JSON.parse（JSON.stringify（））（仅限基本数组和文字数组）
• 自定义函数，如下所示（任意数组）
• 洛达什的_.cloneDeep（）（任意数组）
• jQuery的$.extend（）（任意数组）
• 下划线_.clone（）（仅限基本数组和文字数组）

哪里：

• 基元=字符串、数字和布尔值
• literals=对象文字{}，数组文字[]
• any=原语、文字和原型

深度复制图元数组：

设arr1a=[1，'a'，true]；

要深度复制仅包含基元（即数字、字符串和布尔值）的数组，请重新分配，切片（）,concat（）和下芯克隆（）可以使用。

传播速度最快的地方：

设arr1b=[…arr1a]；

在哪里切片（）性能优于拼接（0）和concat（）

设arr1d=arr1a.slice（）；设arr1c=arr1a.拼接（0）；设arr1e=arr1a.concat（）；

深度复制基本体和对象文字数组：

设arr2a=[1，'a'，true，{}，[]]；让arr2b=JSON.parse（JSON.stringify（arr2a））；

深度复制一组基本体、对象文本和原型：

设arr3a=[1，'a'，true，{}，[]，new Object（）]；

编写自定义函数（性能比jQuery更快$.extend（）)以下为：

函数副本（aObject）{//防止未定义的对象//if（！aObject）返回aObject；让bObject=Array.isArray（aObject）？[] : {};出租价值；for（aObject中的常量键）{//防止自我引用父对象//如果（Object.is（aObject[key]，aObject））继续；value=对象[key]；bObject[key]=（值类型===“对象”）？copy（value）：值；}return bObject；}设arr3b=副本（arr3a）；

或者使用第三方实用程序功能：

设arr3c=$.extend（true，[]，arr3a）；//jQuery（jQuery）设arr3d=_.cloneDeep（arr3a）；//洛达什

Answer 8

这就是我使用的：

函数cloneObject（obj）{var克隆={}；for（obj中的var i）{if（typeof（obj[i]）==“object”&&对象[i]！=null）clone[i]=克隆对象（obj[i]）；其他的克隆[i]=对象[i]；}返回克隆；}

Answer 9

代码：

//使用成员从“到”扩展“from”对象。如果“to”为空，则返回“from”的深度克隆函数扩展（从，到）{if（from==null||typeoffrom！=“object”）返回自；if（from.constructor！=对象&&from.constructor！=数组）从返回；if（from.constructor==日期|| from.confructor==RegExp|| from constructor==函数||from.constructor==字符串||from.confructor==Number ||from constructor==布尔值）从.constructor（from）返回new；to=to | | new from.constructor（）；for（from中的var名称）{to[name]=typeof to[name]==“undefined”？扩展（从[name]，null）：到[name]；}返回；}

测试：

变量对象={date:new date（），func：函数（q）{return 1+q；}，编号：123，text:“asdasd”，数组：[1，“asd”]，regex：新RegExp（/aaa/i），子bj：{数量：234，text:“asdsaD”}}var克隆=扩展（obj）；

Answer 10

用JavaScript深度复制对象（我认为最好也是最简单的）

1.使用JSON.parse（JSON.stringify（object））；

变量对象={a： 1中，b： {c： 2个}}var newObj=JSON.parse（JSON.stringify（obj））；对象b.c=20；控制台.log（obj）；//{a:1，b:{c:20}}console.log（newObj）；//{a:1，b:{c:2}}

2.使用创建的方法

函数cloneObject（obj）{var克隆={}；for（obj中的var i）{if（obj[i]！=空&&typeof（obj[2]）==“对象”）clone[i]=克隆对象（obj[i]）；其他的克隆[i]=对象[i]；}返回克隆；}变量对象={a： 1中，b： {c： 2个}}var newObj=克隆对象（obj）；对象b.c=20；console.log（obj）；//{a:1，b:{c:20}}console.log（newObj）；//{a:1，b:{c:2}}

3.使用Lo-Dash的_.cloneDeep链接洛达什

变量对象={a： 1中，b： {c： 2个}}var newObj=_.cloneDeep（obj）；对象b.c=20；控制台.log（obj）；//{a:1，b:{c:20}}console.log（newObj）；//{a:1，b:{c:2}}

4.使用Object.assign（）方法

变量对象={a： 1中，b： 2个}var newObj=_.clone（obj）；对象b=20；控制台.log（obj）；//{a:1，b:20}console.log（newObj）；//{a:1，b:2}

但错误的时间

变量对象={a： 1中，b： {c： 2个}}var newObj=对象分配（{}，obj）；对象b.c=20；控制台.log（obj）；//｛a:1，b:｛c:20｝｝console.log（newObj）；//{a:1，b:{c:20}-->错误//注意：无法复制原型链上的属性和非枚举属性。

5.使用Underscore.js _.clone链接下划线.js

变量对象={a： 1中，b： 2个}var newObj=_.clone（obj）；对象b=20；控制台.log（obj）；//{a:1，b:20}console.log（newObj）；//{a:1，b:2}

但错误的时间

var obj=｛a： 1中，b： {c： 2个}}var newObj=_.cloneDeep（obj）；对象b.c=20；控制台.log（obj）；//{a:1，b:{c:20}}console.log（newObj）；//{a:1，b:{c:20}-->错误//（创建所提供普通对象的浅复制克隆。任何嵌套对象或数组都将通过引用进行复制，而不是复制。）

JSBEN公司。CH绩效标杆游戏场1~3http://jsben.ch/KVQLd

Answer 11

在JS中，克隆对象一直是一个问题，但这都是关于ES6之前的事，我在下面列出了用JavaScript复制对象的不同方法，假设您有下面的对象，并希望有一个深入的副本：

变量obj={a:1，b:2，c:3，d:4}；

有几种方法可以在不更改原点的情况下复制此对象：

1. ES5+，使用简单的功能为您复制：

   函数deepCopyObj（obj）{如果（null==obj||“object”！=typeofobj）返回obj；if（obj实例日期）{var copy=新日期（）；copy.setTime（obj.getTime（））；返回副本；}if（obj实例数组）{var副本=[]；对于（var i=0，len=obj.length；i<len；i++）{copy[i]=deepCopyObj（obj[i]）；}返回副本；}if（obj对象实例）{var-copy={}；for（obj中的var属性）{如果（obj.hasOwnProperty（attr））copy[attr]=deepCopyObj（obj[attr]）；}返回副本；}throw new Error（“无法复制对象this object.”）；}

2. ES5+，使用JSON.parse格式和JSON.stringify格式.

   var deepCopyObj=JSON.parse（JSON.stringify（obj））；

3. 角度：

   var deepCopyObj=角度复制（obj）；

4. jQuery（查询）：

   var deepCopyObj=jQuery.extend（true，{}，obj）；

5. Underscore.js和Lodash：

   var deepCopyObj=_.cloneDeep（obj）//Underscore.js的最新版本进行了浅层复制

希望这些帮助…

Answer 12

var克隆=函数（）{var newObj=（此数组实例）？[] : {};for（此处为var i）{if（此[i]&&此[i]的类型==“对象”）{newObj[i]=此[i].clone（）；}其他的{newObj[i]=此[i]；}}return newObj；}; Object.defineProperty（Object.protype，“clone”，{value:clone，enumerable:false}）；

Answer 13

有一个库（称为“克隆”），这做得很好。它提供了我所知的最完整的任意对象递归克隆/复制。它还支持循环引用，其他答案还没有涵盖。

你可以在npm上找到它也是。它可以用于浏览器以及Node.js。

下面是如何使用它的示例：

使用安装

npm安装克隆

或者用包装恩德.

ender构建克隆[…]

您还可以手动下载源代码。

然后可以在源代码中使用它。

var clone=require（“克隆”）；vara={foo:{bar:'baz'}}；//a的初始值var b=克隆（a）；//克隆a->ba.foo.bar='foo'；//更改a控制台.log（a）；//｛foo:｛bar:“foo”｝｝控制台.log（b）；//{foo:{bar:'baz'}}

（免责声明：我是图书馆的作者。）

Answer 14

我知道这是一个老帖子，但我认为这可能对下一个蹒跚而行的人有所帮助。

只要不将对象指定给任何对象，它就不会在内存中保持引用。因此，要制作一个要与其他对象共享的对象，必须创建这样的工厂：

var a=函数（）{返回{父亲：‘撒迦利亚’};},b=a（），c=a（）；c.father=“johndoe”；警惕（b.父亲）；

Answer 15

如果你正在使用它下划线.js图书馆有一个克隆方法。

var newObject=_.clone（旧对象）；

Answer 16

下面是ConroyP上述答案的一个版本，即使构造函数具有所需的参数，该版本仍然有效：

//如果Object.create尚未定义，我们只需进行简单的填充，//没有第二个论点，因为这就是我们这里所需要的var object_create=对象创建；if（typeof object_create！==“函数”）{object_create=函数（o）{函数F（）｛｝F.原型=o；返回新的F（）；};}函数deepCopy（obj）{if（obj==null||typeof（obj）！=='对象'）{返回对象；}//确保返回的对象与原始对象具有相同的原型var ret=对象创建（obj.constructor.prototype）；for（obj中的var键）{ret[key]=深度复制（obj[key]）；}返回ret；}

此功能在我的单纯形库。

编辑：

下面是一个更健壮的版本（由于Justin McCandless，现在也支持循环引用）：

/***深度复制对象（复制其所有对象属性、子属性等）*的改进版本http://keithdevens.com/weblog/archive/2007/Jun/07/javascript.clone*如果构造函数具有必需的参数，则不会中断* *它还借用了一些代码http://stackoverflow.com/a/11621004/560114*/ 函数deepCopy（src，/*内部*/_visited，_copiesVisited）{if（src===null||typeof（src）！=='对象'）{返回src；}//遵循本机/自定义克隆方法if（src.clone的类型==“函数”）{return src.clone（true）；}//特殊情况：//日期if（src-instanceof Date）{return new Date（src.getTime（））；}//注册Expif（RegExp的src实例）{return new RegExp（src）；}//DOM元素if（src.nodeType&&typeof src.cloneNode==“函数”）{return src.cloneNode（true）；}//如果需要，初始化访问的对象阵列。//这用于检测循环引用。if（已访问===未定义）{_已访问=[]；_copiesVisited=[]；}//检查此对象是否已被访问var i，len=访问长度；对于（i=0；i<len；i++）{//如果是，请获取我们已经制作的副本if（src===访问[i]）{return _copiesVisited[i]；}}//阵列if（Object.prototype.toString.call（src）==“[Object Array]”）{//[].slice（）本身将进行软克隆var ret=src.slice（）；//将其添加到已访问数组_visited.push（src）；_copiesVisited.push（ret）；var i=重试长度；同时（i--）{ret[i]=深度复制（ret[i]，_visited，_copiesVisited）；}返回ret；}//如果我们到达这里，我们有一个常规对象//确保返回的对象与原始对象具有相同的原型var proto=（Object.getPrototypeOf？Object.getProtoypeOv（src）：src__原型）；if（！原型）{proto=src.constructor.protype//这一行可能只有非常旧的浏览器才能访问}var dest=对象创建（原型）；//将此对象添加到访问过的数组_visited.push（src）；_copiesVisited.push（dest）；for（src中的var键）{//注意：这不会保留ES5属性属性，如“可写”、“可枚举”等。//有关如何对此进行修改的示例，请参见singleMixin（）函数dest[key]=deepCopy（src[key]，_visited，_copiesVisited）；}返回目的地；}//如果Object.create还没有定义，我们只需要做简单的填充，//没有第二个论点，因为这就是我们这里所需要的var object_create=对象创建；if（typeof object_create！==“函数”）{object_create=函数（o）{函数F（）{}F.原型=o；返回新的F（）；};}

Answer 17

下面创建了同一对象的两个实例。我找到了它，目前正在使用。它简单易用。

var objToCreate=JSON.parse（JSON.stringify（cloneThis））；

Answer 18

克罗福德建议（我更喜欢）使用此函数：

函数对象（o）{函数F（）{}F.原型=o；返回新的F（）；}var newObject=对象（oldObject）；

它很简洁，可以按预期工作，而且您不需要库。

---

编辑：

这是用于对象.创建，所以您也可以使用它。

var newObject=对象.create（oldObject）；

注：如果您使用其中的一些，您可能会遇到使用拥有自己的财产.因为，创造创建继承的新空对象旧对象。但对于克隆对象来说，它仍然是有用且实用的。

例如，如果oldObject.a=5；

newObject.a；//是5

但是：

oldObject.hasOwnProperty（a）；//是真的newObject.hasOwnProperty（a）；//是false

Answer 19

功能克隆（obj）{var克隆={}；克隆.原型=obj.原型；for（obj中的属性）clone[属性]=obj[属性]；返回克隆；}

Answer 20

Lodash有一个漂亮的_.cloneDeep（值）方法：

var对象=[{'a'：1}，{'b'：2}]；var depth=_.cloneDeep（对象）；console.log（深度[0]===对象[0]）；//=>假

Answer 21

浅拷贝单层(ECMAScript第5版)以下为：

varorigin={foo:{}}；var copy=Object.keys（origin）.reduce（函数（c，k）{c[k]=origin[k]；返回c；}，{}）；console.log（原始、副本）；console.log（origin==副本）；//假console.log（origin.foo==副本.foo）；//真的

和浅拷贝单线(ECMAScript第6版, 2015):

varorigin={foo:{}}；var-copy=Object.assign（{}，原点）；console.log（源，副本）；console.log（origin==副本）；//假console.log（origin.foo==副本.foo）；//真的

Answer 22

对于类数组对象，似乎还没有理想的深度克隆操作符。如下面的代码所示，John Resig的jQuery cloner将具有非数值属性的数组转换为非数组的对象，RegDwight的JSON cloner删除了非数值属性。以下测试在多个浏览器上演示了这些要点：

函数jQueryClone（obj）{return jQuery.extend（true，｛｝，obj）}函数JSONClone（obj）{return JSON.parse（JSON.stringify（obj））}var arrayLikeObj=[[1，“a”，“b”]，[2，“b“，”a“]]；arrayLikeObj.names=[“m”，“n”，“o”]；var JSONCopy=JSONClone（arrayLikeObj）；var jQueryCopy=jQueryClone（arrayLikeObj）；alert（“arrayLikeObj是数组实例吗？”+（array的arrayLikeObj实例）+“\njQueryClone是数组实例吗？”+（jQueryCopy instanceof array）+“arrayLikeObj名称是什么？”+arrayLike Obj.names+“\n JSONClone名称是什么？”+JSONCopy.names）

Answer 23

只是因为我没看见AngularJS公司提到并认为人们可能想知道。。。

角度复制还提供了一种深度复制对象和数组的方法。

Answer 24

根据您的目标是不是克隆一个“普通的旧JavaScript对象”，我有两个很好的答案。

我们还假设您的意图是创建一个完整的克隆，并且没有对源对象的原型引用。如果您对完整的克隆不感兴趣，那么可以使用其他一些答案中提供的许多Object.clone（）例程（Crockford的模式）。

对于普通的旧JavaScript对象，在现代运行时中克隆对象的一种行之有效的好方法非常简单：

var clone=JSON.parse（JSON.stringify（obj））；

请注意，源对象必须是纯JSON对象。也就是说，它的所有嵌套属性都必须是标量（如布尔值、字符串、数组、对象等）。任何函数或特殊对象（如RegExp或Date）都不会被克隆。

它有效率吗？见鬼，是的。我们尝试了各种克隆方法，效果最好。我相信一些忍者会想出一个更快的方法。但我怀疑我们谈论的是边际收益。

这种方法简单易行。把它包装成一个方便的函数，如果你真的需要挤出一些收益，请稍后再做。

现在，对于非显式JavaScript对象，没有一个真正简单的答案。事实上，这是不可能的，因为JavaScript函数和内部对象状态的动态特性。深度克隆包含函数的JSON结构需要重新创建这些函数及其内部上下文。JavaScript根本没有一种标准化的方法来实现这一点。

要做到这一点，正确的方法是通过一个方便的方法，您可以在代码中声明并重用该方法。方便的方法可以赋予您对自己对象的一些理解，这样您可以确保在新对象中正确地重新创建图形。

我们是自己编写的，但这里介绍了我见过的最佳通用方法：

http://davidwalsh.name/javascript-clone

这是正确的想法。作者（David Walsh）评论了广义函数的克隆。根据您的用例，您可能会选择这样做。

其主要思想是，您需要在每种类型的基础上专门处理函数（或者说原型类）的实例化。这里，他为RegExp和Date提供了几个示例。

这段代码不仅简短，而且可读性很强。它很容易扩展。

这有效吗？见鬼，是的。鉴于目标是生成真正的深度复制克隆，那么您必须遍历源对象图的成员。使用这种方法，您可以精确地调整要处理的子成员以及如何手动处理自定义类型。

好了，就这样。两种方法。在我看来，两者都很有效。

Answer 25

我很晚才回答这个问题，但我有另一种克隆对象的方法：

函数cloneObject（obj）{if（obj===null||typeof（obj）！=='对象'）返回对象；var temp=对象构造函数（）；//改变for（obj中的var键）{if（Object.prototype.hasOwnProperty.call（obj，key））{obj['isActiveClone']=空；temp[key]=克隆对象（obj[key]）；删除对象['isActiveClone']；}}返回温度；}var b=克隆对象（{“a”：1，“b”：2}）；//打电话

这比以下方法更好更快：

变量a={“a”：1，“b”：2}；var b=JSON.parse（JSON.stringify（a））；

和

变量a={“a”：1，“b”：2}；//深度复制var newObject=jQuery.extend（true，{}，a）；

我已经对代码进行了基准测试，您可以测试结果在这里:

并分享结果：参考文献：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty网站

Answer 26

只有当您可以使用ECMA脚本6或转发器.

特征：

• 复制时不会触发getter/setter。
• 保留getter/setter。
• 保留原型信息。
• 适用于两者对象-边和功能性的 面向对象写作风格。

代码：

功能克隆（目标、源）{for（让密钥进入源）{//使用getOwnPropertyDescriptor而不是source[key]来防止触发setter/getter。let描述符=Object.getOwnPropertyDescriptor（源，键）；if（字符串的描述符.value实例）{target[key]=新字符串（descriptor.value）；}else if（数组的描述符.value实例）{target[key]=克隆（[]，descriptor.value）；}else if（描述符.对象的值实例）{let prototype=Reflect.getPrototypeOf（descriptor.value）；让cloneObject=克隆（{}，descriptor.value）；Reflect.setPrototypeOf（cloneObject，prototype）；target[key]=克隆对象；}其他{Object.defineProperty（目标、键、描述符）；}}let prototype=Reflect.getPrototypeOf（源）；Reflect.setPrototypeOf（目标，原型）；返回目标；}

Answer 27

这通常不是最有效的解决方案，但它满足了我的需要。下面的简单测试用例。。。

功能克隆（obj，克隆）{//制作“obj”的深度副本。处理循环结构//在“clones”参数中跟踪克隆的obj。功能//包括但不克隆。函数成员被克隆。变量new_obj，已经克隆，t=对象类型，i=0，我，一对；clones=克隆||[]；if（obj===空）{返回对象；}if（t===“对象”||t==“函数”）{//看看我们是否已经克隆了obj对于（i=0，l=克隆长度；i<l；i++）{pair=克隆[i]；if（对[0]===obj）{already_clone=对[1]；断裂；}}if（已克隆）{return already_clone；}其他{if（t===“对象”）{//创建新对象new_obj=新对象构造函数（）；}else{//按原样使用函数new_obj=对象；}clones.push（[obj，new_obj]）；//跟踪我们克隆的对象for（obj中的键）{//克隆对象成员if（obj.hasOwnProperty（键））{new_obj[key]=克隆（obj[key]，克隆）；}}}}return new_obj | obj；}

循环数组测试。。。

a=[]a.推动（“b”、“c”、a）aa=克隆（a）aa===a//=>假aa[2]===a//=>错误aa[2]===a[2]//=>假aa[2]===aa//=>真

功能测试。。。

f=新功能f.a=aff=克隆（f）ff==f//=>真ff.a===a//=>假

Answer 28

对于想要使用JSON.parse（JSON.stringify（obj））版本，但在不丢失Date对象的情况下，可以使用第二个参数解析方法将字符串转换回Date：

功能克隆（obj）{var regExp=/^\d{4}-\d日{2}-\d日{2} T型\d{2}：\d{2{：\d{2}\。\d日{3} Z轴$/;return JSON.parse（JSON.stringify（obj），函数（k，v）{if（类型v===“字符串”&&regExp.test（v））return新日期（v）返回v；})}//用法：var原始={a： [1，null，未定义，0，{a:null}，new Date（）]，b：{c（）{返回0}}}var cloned=克隆（原始）console.log（克隆）

Answer 29

我不同意投票最多的答案在这里.A型递归深度克隆是速度快得多比JSON.parse（JSON.stringify（obj））提到的方法。

• 杰斯佩夫在这里排名第一：https://jsperf.com/deep-copy-vs-json-stringify-json-parse/5
• 杰斯本从上述答案中可以看出，递归深度克隆击败了所有其他提到的克隆：http://jsben.ch/13YKQ网站

下面是供快速参考的函数：

函数cloneDeep（o）{让newO让我来吧if（typeof o！==“object”）返回o如果（！o）返回oif（Object.protype.toString.apply（o）==='[Object Array]'）{新O=[]对于（i=0；i<o.length；i+=1）{newO[i]=克隆深度（o[i]）}返回newO}新O={}for（i in o）{如果（o.hasOwnProperty（i））{newO[i]=克隆深度（o[i]）}}返回newO}

Answer 30

//obj目标对象，vals源对象var setVals=函数（obj，vals）{if（对象和值）{for（vals中的var x）{if（vals.hasOwnProperty（x））{if（obj[x]&&typeof vals[x]===“对象”）{obj[x]=设置值（obj[x]，vals[x]）；}其他{obj[x]=值[x]；}}}}返回对象；};