JS浅克隆深克隆

122 阅读1分钟

一、什么是浅拷贝、什么是深拷贝

  • MDN定义

    • 对象的浅拷贝是其属性与拷贝源对象的属性共享相同引用(指向相同的底层值)的副本。因此,当你更改源或副本时,也可能导致其他对象也发生更改——也就是说,你可能会无意中对源或副本造成意料之外的更改。这种行为与深拷贝的行为形成对比,在深拷贝中,源和副本是完全独立的。

    • 对象的深拷贝是指其属性与其拷贝的源对象的属性不共享相同的引用(指向相同的底层值)的副本。因此,当你更改源或副本时,可以确保不会导致其他对象也发生更改;也就是说,你不会无意中对源或副本造成意料之外的更改。这种行为与浅拷贝的行为形成对比,在浅拷贝中,对源或副本的更改可能也会导致其他对象的更改(因为两个对象共享相同的引用)。

浅克隆方法

在 JavaScript 中,所有标准的内置对象复制操作(创建的是浅拷贝而不是深拷贝。):

  • 展开语法
  • Array.prototype.concat()
  • Array.prototype.slice()
  • Array.from()
  • Object.assign()
  • Object.create()

深拷贝方法

  • JSON.parse(JSON.stringify(对象))

    • 问题:

      但许多 JavaScript 对象根本不能序列化——例如,函数(带有闭包)、Symbol、在 HTML DOM API 中表示 HTML 元素的对象、递归数据以及许多其他情况。在这种情况下,调用 JSON.stringify() 来序列化对象将会失败。

  • 自己封装,或者三方库( 例如lodash 的_.cloneDepp()方法 )