快上网专注成都网站设计 成都网站制作 成都网站建设
成都网站建设公司服务热线:028-86922220

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

es6深度拷贝的实现方法有哪些

这篇文章主要介绍“es6深度拷贝的实现方法有哪些”,在日常操作中,相信很多人在es6深度拷贝的实现方法有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”es6深度拷贝的实现方法有哪些”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

成都创新互联专业做网站、成都网站制作,集网站策划、网站设计、网站制作于一体,网站seo、网站优化、网站营销、软文平台等专业人才根据搜索规律编程设计,让网站在运行后,在搜索中有好的表现,专业设计制作为您带来效益的网站!让网站建设为您创造效益。

深度拷贝的实现方法:1、使用“Object.assign({},obj)”语句来实现;2、使用“JSON.parse(JSON.stringify(obj))”语句来实现;3、使用“$.extend(true,[],arr)”语句来实现。

本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。

什么是深度拷贝

深拷贝就是相对与浅拷贝而言的,最主要的差异体现在引用类型上,从本质上讲就是浅拷贝只简简单单地把栈当中的引用地址拷贝了一份,所以当你修改新拷贝出来的值的时候,被拷贝的对象也会被你修改掉;而深拷贝是会在堆内存当中为新对象建立空间,所以被拷贝的对象就不会被无缘无故地被修改掉了。

es6中如何实现深度拷贝

方法1:使用Object.assign

Object.assign默认是对对象进行深拷贝的,但是我们需要注意的是,它只对最外层的进行深拷贝,也就是当对象内嵌套有对象的时候,被嵌套的对象进行的还是浅拷贝;

function cloneDeepAssign(obj){
  return Object.assign({},obj)
}

(温馨提示:数组拷贝方法当中,使用...sliceconcat等进行拷贝也是一样的效果,只深拷贝最外层)

同时,我们知道Object.assign针对的是对象自身可枚举的属性,对于不可枚举的没有效果;

所以,当我们对于一个层次单一对象的时候,可以考虑这种方法,简单快捷。(试过了,也不支持undefined)

方法2:利用JSON

这是我们最最最常提到的一种深拷贝的方式,一般大部分的深拷贝都可以用JSON的方式进行解决,本质是因为JSON会自己去构建新的内存来存放新对象。

function cloneDeepJson(obj){
  return JSON.parse(JSON.stringify(obj))
}

但是我们要注意的是:

  • 会忽略 undefinedsymbol

  • 不可以对Function进行拷贝,因为JSON格式字符串不支持Function,在序列化的时候会自动删除;

  • 诸如 Map, Set, RegExp, Date, ArrayBuffer 和其他内置类型在进行序列化时会丢失;

  • 不支持循环引用对象的拷贝;(循环引用的可以大概地理解为一个对象里面的某一个属性的值是它自己)

方法3:利用jQuery的$.extend()

var array = [1,2,3,4];
var newArray = $.extend(true,[],array);

显而易见,最大的缺点就是我们还需要引入jQuery库了,所以也不太常用;

到此,关于“es6深度拷贝的实现方法有哪些”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注创新互联网站,小编会继续努力为大家带来更多实用的文章!


当前标题:es6深度拷贝的实现方法有哪些
网站路径:http://6mz.cn/article/joeggs.html

其他资讯