一尘不染

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

javascript

clone JavaScript对象的最有效方法是什么？我见过obj = eval(uneval(o));使用它，但这是非标准的，仅受Firefox支持。

我做了类似的事情，obj = JSON.parse(JSON.stringify(o));但对效率提出了质疑。

我还看到了具有各种缺陷的递归复制功能。
我很惊讶没有规范的解决方案存在。

阅读 519

2020-04-22

共1个答案

一尘不染

快速clone而数据丢失-JSON.parse / stringify

如果不使用DateS，功能，undefined，Infinity，正则表达式，Maps, Sets, Blobs，的文件列表，ImageDatas，稀疏数组，类型化数组或其他复杂类型的对象中，一个很简单的一个衬垫深克隆的对象是：

JSON.parse(JSON.stringify(object))

const a = {

  string: 'string',

  number: 123,

  bool: false,

  nul: null,

  date: new Date(),  // stringified

  undef: undefined,  // lost

  inf: Infinity,  // forced to 'null'

  re: /.*/,  // lost

}

console.log(a);

console.log(typeof a.date);  // Date object

const clone = JSON.parse(JSON.stringify(a));

console.log(clone);

console.log(typeof clone.date);  // result of .toISOString()

Reliable cloning using a library

由于cloning objects并非易事（复杂类型，循环引用，函数等），因此大多数主要库都提供了用于克隆对象的函数。 Don’t reinvent the wheel如果您已经在使用库，请检查它是否具有对象cloning功能。例如，

odash- cloneDeep; 可以通过lodash.clonedeep模块单独导入，如果您尚未使用提供深度克隆功能的库，则可能是您的最佳选择
AngularJS- angular.copy
jQuery- jQuery.extend(true, { }, oldObject); .clone()仅cloning DOM元素

ES6

为了完整起见，请注意ES6提供了两种浅表复制机制：Object.assign()和扩展语法。它将所有可枚举的自身属性的值从一个对象复制到另一个对象。例如：

var A1 = {a: "2"};
var A2 = Object.assign({}, A1);
var A3 = {...A1};  // Spread Syntax

2020-04-22