• 技术文章 >web前端 >前端问答

    es6深度拷贝的几种实现方法是什么

    青灯夜游青灯夜游2022-03-23 12:06:52原创115

    深度拷贝的实现方法: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))
    }

    但是我们要注意的是:

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

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

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

    【相关推荐:javascript视频教程web前端

    以上就是es6深度拷贝的几种实现方法是什么的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:es6 深度拷贝
    上一篇:看看这些关于浏览器的面试题,你能答对几个? 下一篇:es2017是es6吗
    Web大前端开发直播班

    相关文章推荐

    • es6怎么判断是不是数字• es6怎么将对象转成数组• es6数组怎么清除所有元素• es6中map和foreach有什么区别• es6怎么比较2个数组的值是否相等• es6怎么判断数组是否为空
    新人一分购

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网