美文网首页
js实现深拷贝和浅拷贝

js实现深拷贝和浅拷贝

作者: CCCCCccccccch | 来源:发表于2020-04-09 20:13 被阅读0次

1、如何分辨深拷贝和浅拷贝

简单来说,假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明是浅拷贝,如果B没变,那就是深拷贝。

2、拷贝基本数据类型与引用数据类型的区别

基本数据类型有,number,string,boolean,null,undefined,symbol以及未来ES10新增的BigInt(任意精度整数)七类。

引用数据类型(Object类)有常规名值对的无序对象{a:1},数组[1,2,3],以及函数等。

基本类型的数据存储

上图中,当你修改a=2,对b并不会造成影响,但这也算不上深拷贝,因为深拷贝本身就是针对较为复杂的Object类型数据

Object类型拷贝原理如下图:

引用数据类型的拷贝原理

3、深拷贝、浅拷贝的方法

数组的浅拷贝,除了直接赋值,可以用concat、slice返回一个新数组的特性来实现拷贝。如果数组内的项都是基本数据类型(即结构层级只有一层),也相当于深拷贝的作用。但是如果数组嵌套了对象或者数组的话,concat、slice只能深拷贝第一层级的数据项,嵌套的数据还是只能拷贝引用地址,所以这时改变复制后的值会影响原本的值,这时候就需要深拷贝。

有一种简单的方式,既能深拷贝数组也能深拷贝对象:

JSON.parse(JSON.stringify(arr))

4、JS实现深拷贝通用方法

实现思路:遍历对象,把属性和属性值都放到一个新的对象里,如果属性值也是一个对象,则再递归调用一次。

相关文章

  • js浅拷贝深拷贝

    js浅拷贝,深拷贝的简单实现 基础数据 浅拷贝 深拷贝

  • JS中的深拷贝与浅拷贝

    知乎:js中的深拷贝和浅拷贝? 掘金: js 深拷贝 vs 浅拷贝 前言 首先深拷贝与浅拷贝只针对 Object,...

  • 2020前端高频面试题总结(附答案)

    [ js基础题 ] 1. new的实现原理是什么? 2. 深拷贝和浅拷贝的区别是什么 深拷贝 浅拷贝 3. bin...

  • 浅拷贝和深拷贝

    本文参考:JavaScript中的浅拷贝和深拷贝js 深拷贝 vs 浅拷贝深入剖析 JavaScript 的深复制...

  • 五、面试总结(五)

    对象 拷贝(clone) 如何实现对象克隆 深拷贝和浅拷贝区别 深拷贝和浅拷贝如何实现激活机制 写clone()方...

  • JS实现深拷贝、instanceof、判断是否为数组

    JS深拷贝 JS中拷贝对象可以按照拷贝的程度可以分为浅拷贝和深拷贝,有些时候我们需要拷贝之后的对象和拷贝之前的对象...

  • JS中对象的复制

    JS中的对象复制分为两种情况:深拷贝和浅拷贝。深拷贝和浅拷贝的区别在于对数组和对象的拷贝,对它们拷贝时浅拷贝只是拷...

  • 深拷贝、浅拷贝

    父类实现深拷贝时,子类如何实现深度拷贝。父类没有实现深拷贝时,子类如何实现深度拷贝。 深拷贝同浅拷贝的区别:浅拷贝...

  • 面试题整理

    父类实现深拷贝时,子类如何实现深度拷贝。父类没有实现深拷贝时,子类如何实现深度拷贝。 深拷贝同浅拷贝的区别:浅拷贝...

  • js深拷贝浅拷贝

    目录 一.数据类型 二.浅拷贝与深拷贝 三.赋值和浅拷贝的区别 四.浅拷贝的实现方式 五.深拷贝的实现方式 一.数...

网友评论

      本文标题:js实现深拷贝和浅拷贝

      本文链接:https://www.haomeiwen.com/subject/jvkxmhtx.html