美文网首页
深拷贝与浅拷贝

深拷贝与浅拷贝

作者: lvyweb | 来源:发表于2021-08-16 11:02 被阅读0次

数据分为基本数据类型(String, Number, Boolean, Null, Undefined,Symbol)和对象数据(object)类型。

1、基本数据类型的特点:直接存储在栈(stack)中的数据

2、引用数据类型的特点:存储的是该对象在栈中引用,真实的数据存放在堆内存里

深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的。

深拷贝的实现方式

  1. 手写深拷贝
    递归方法实现深度克隆原理:遍历对象、数组直到里边都是基本数据类型,然后再去复制,就是深度拷贝。
  function deepClone(obj = {}){
        if(typeof obj!='object' || obj == null){
            return obj;
        }
        let result;
        if(obj instanceof Array){
            result = []
        }else{
            result = {};
        }
        for(let key in obj ){
            if(obj.hasOwnProperty(key)){
                result[key] = deepClone(obj[key]);
            }
        }
        return result;
    }

    var obj1 = {
        'name' : 'August',
        'age' :  '18',
        'language' : [1,[2,3],[4,5]],
    };
    var obj2= deepClone(obj1);
    console.log('obj2===',obj2);
    obj2.name = 'September';
    console.log('obj1===',obj1,'obj2====',obj2);
  1. JSON.parse(JSON.stringify())
let arr = [1, 3, {
     username: 'August'
}];
let newArr = JSON.parse(JSON.stringify(arr));
newArr[2].username = 'September';
console.log(arr, newArr)

原理: 用JSON.stringify将对象转成JSON字符串,再用JSON.parse()把字符串解析成对象,一去一来,新的对象产生了,而且对象会开辟新的栈,实现深拷贝。
这种方法虽然可以实现数组或对象深拷贝,但不能处理函数。
这是因为 JSON.stringify() 方法是将一个JavaScript值(对象或者数组)转换为一个 JSON字符串,不能接受函数。

  1. 函数库lodash
    该函数库也有提供_.cloneDeep用来做Deep Copy
var arr = require('lodash');
var obj1 = {
   a: 1,
   b: { f: { g: 1 } },
   c: [1, 2, 3]
};
var obj2 = arr .cloneDeep(obj1);
console.log(obj1.b.f === obj2.b.f);
// false

浅拷贝的实现方式

  1. Object.assign()
    Object.assign()方法可以把任意多个的源对象自身可枚举属性给目标对象,然后返回目标对象。但是Object.assign()进行的是浅拷贝,拷贝的是对象的属性的引用,而不是对象本身。
    eg:
    let obj = { a: {name: "August", b: 18} };
    let initalObj = Object.assign({}, obj);
    initalObj.a.name= "September";
    console.log(obj.a.name); // September

当object 只有一层的时候,是深拷贝

  1. Array.prototype.concat()
 let arr = [1, 3, {
        username: 'August'
  }];
 let arr2 = arr.concat();    
//修改新对象会改到原对象:
 arr2[2].username = 'September';
 console.log(arr);
  1. Array.prototype.slice()
    用法同concat

关于Array的slice和concat方法的补充说明:Array的slice和concat方法不修改原数组,只会返回一个浅复制了原数组中的元素的一个新数组

相关文章

  • JS中的深拷贝与浅拷贝

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

  • 认识js下的浅拷贝与深拷贝

    浅拷贝与深拷贝 首先深拷贝和浅拷贝只针对像 Object, Array 这样的复杂对象的。简单来说,浅拷贝只拷贝一...

  • iOS深拷贝(MutableCopy)与浅拷贝(Copy)的区别

    深拷贝和浅拷贝的概念 iOS中有深拷贝和浅拷贝的概念,那么何为深拷贝何为浅拷贝呢?浅拷贝:浅拷贝并不拷贝对象本身,...

  • Objective-C中的浅拷贝和深拷贝

    Objective-C中的浅拷贝和深拷贝IOS开发之深拷贝与浅拷贝(mutableCopy与Copy)详解iOS ...

  • 深拷贝和浅拷贝

    干货!深拷贝和浅拷贝的区别 深拷贝才是拷贝,浅拷贝就是Retain Copy与Retain的区别 Copy: 根据...

  • js浅拷贝、深拷贝

    前言 本文主要简单讲一下什么是浅拷贝、什么是深拷贝、深拷贝与浅拷贝的区别,以及怎么进行深拷贝和怎么进行浅拷贝。 一...

  • iOS 图文并茂的带你了解深拷贝与浅拷贝

    iOS 图文并茂的带你了解深拷贝与浅拷贝 iOS 图文并茂的带你了解深拷贝与浅拷贝

  • 深拷贝和浅拷贝

    1: iOS开发 深拷贝与浅拷贝 2: iOS 浅谈:深.浅拷贝与copy.strong 3: iOS开发——深...

  • [C++之旅] 15 深拷贝与浅拷贝

    [C++之旅] 15 深拷贝与浅拷贝 拷贝构造函数分为深拷贝和浅拷贝两种方式 浅拷贝只是将被拷贝的对象的成员直接赋...

  • 深拷贝VS浅拷贝

    深拷贝VS浅拷贝 本文主要对深拷贝&浅拷贝的解释及实现做一下简单记录。 之所以会有深拷贝与浅拷贝之分,是因为不同数...

网友评论

      本文标题:深拷贝与浅拷贝

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