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

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

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

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

什么是深度拷贝

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

es6中如何实现深度拷贝

方法1:使用Object.assign

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

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

登录后复制

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

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

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

方法2:利用JSON

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

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

登录后复制

但是我们要注意的是:

会忽略 undefined和symbol;

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

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

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

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

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

登录后复制

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

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

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

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2935300.html

(0)
上一篇 2025年3月11日 20:50:29
下一篇 2025年2月22日 18:08:50

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • es2017是es6吗

    es2017不是es6;es2017又称es8,和es6是两个版本。es2017是2017年发布的ECMAScript的第8个版本,因此也可简称为es8;而es6是2015年发布的ECMAScript的第6个版本,也可称为es2015。 本…

    2025年3月11日
    200
  • es6箭头函数要注意什么

    注意事项:1、箭头函数会改变函数内this的指向与上级作用域中的this指向保持一致;2、不可以当作构造函数,即不可以使用new命令;3、不可以使用arguments对象;4、不可以使用yield命令,不能用作Generator函数。 本教…

    2025年3月11日
    200
  • es6中什么是装饰器

    在es6中,装饰器(Decorator)是一种与类(class)相关的语法,用来注释或修改类和类方法;装饰器其实就是一个编译时执行的函数,语法“@函数名”,通常放在类和类方法的定义前面。装饰器有两种:类装饰器和类方法装饰器。 本教程操作环境…

    2025年3月11日
    200
  • assign是es6方法吗

    assign是es6方法。assign()是es6 Object对象新增的一个方法,“Object.assign()”方法用于对象的合并,可以将源对象的所有可枚举属性,复制到目标对象上;该方法的第一个参数是目标对象,后面的参数都是源对象。 …

    2025年3月11日
    200
  • es6怎么判断数组是否有某一项值

    判断方法:1、使用“arr.includes(元素值)”语句,如果返回值为true,则数组中有某一项;2、使用“arr.findIndex((v)=>{return v==元素值;})”语句,如果返回值不为“-1”,则数组中包含某一项…

    2025年3月11日
    200
  • es6怎么把字符串转化为对象

    转化方法:1、用“let 对象名 = {key1:”字符串1″,key2:”字符串2″,…}”语句,可将字符串转为对象的value;2、用“let 对象名={};对象名[&#822…

    2025年3月11日
    200
  • es6怎么判断对象key是否存在

    判断方法:1、用“Object.keys(obj)”语句返回一个包含obj对象所有key的数组;2、用“数组.includes(“key值”)”语句判断该key数组中是否存在指定值,如果返回值为true,则对象中存在…

    2025年3月11日
    200
  • es6新增的遍历方法有哪些

    新增的遍历方法有:1、findIndex(),可遍历数组,查找匹配的元素;2、find(),可遍历数组,查找第一个匹配的元素;3、entries(),对键值对进行遍历;4、keys(),对键名进行遍历;5、values(),对键值进行遍历。…

    2025年3月11日
    200
  • es6 math方法有哪些

    math方法有:1、指数方法,包含pow()、sqrt()等;2、对数方法,包含log()、log10()等;3、代数方法,包含abs()、sign()等;4、三角函数,包含sin()、cos()等;4、random(),返回伪随机数。 本…

    2025年3月11日
    200
  • es6中symbol到底是什么

    es6中的symbol是一种新的原始数据类型,用于表示独一无二的值,最大的用法是用来定义对象的唯一属性名;因为Symbol是原始数据类型,不是对象,所以Symbol函数栈不能用new命令。 本教程操作环境:windows10系统、ECMAS…

    2025年3月11日
    200

发表回复

登录后才能评论