zoukankan      html  css  js  c++  java
  • js对象的深拷贝及其的几种方法

    深拷贝和浅拷贝是javascript中一个比较复杂的问题,也是面试官最喜欢问的问题之一,通过这个为可以看出是否入门,深拷贝和浅拷贝也是初学者经常犯错一个点。

    简单来说深拷贝是拷贝储存在栈中的对象,而浅拷贝是从内存中拷贝,这就涉及到数据存放位置了,总所周知,数据大体可以分为两种数据类型,一种是基本数据类型,数据结构不是很复杂,单独可以存在内存中就可以,而另一种是复杂数据类型,也叫引用数据类型,例如数组和对象,是放在栈中存储的,而基本数据类型是放在内存中的,不涉及深拷贝和浅拷贝,也可以说基本数据类型都是深拷贝

    而引用类型数据存储比较复杂,例如var a=[1,3,4]  这句话的存储就是首先在内存开辟一个空间,但是内存当中不可以存储这种复杂数据类型,所以要把这种结构放到栈当中,栈相当于一个密码箱,而钥匙存在内存当中,这就构成了一个存储关系,浅拷贝var b=a简单来说就是把这份钥匙复制了一份,但内存当中的数据并没有复制,所以如果改变a相应b也会改变

    而深拷贝则需要在栈中在生成一个密码箱,生成一把新钥匙(钥匙2),这样深拷贝的两种数值不会相互影响,也可以说没有任何关系了

    方法:

    1:jq使用,$.extend({},obj)

    2:Object.assign({},obj)

    这两种比较基础,估计都会使用

    3:clone(obj)

    var clone = function (obj) { return JSON.parse(JSON.stringify(obj)); }
    这种方法有种缺陷,这种方法会忽略值为function以及undefied的字段,而且对date类型的支持也不太友好。 

    4:clone(obj)

    var clone = function (obj) {
    if(obj === null) return null
    if(typeof obj !== 'object') return obj;
    if(obj.constructor===Date) return new Date(obj);
    var newObj = new obj.constructor (); //保持继承链
    for (var key in obj) {
    if (obj.hasOwnProperty(key)) { //不遍历其原型链上的属性
    var val = obj[key];
    newObj[key] = typeof val === 'object' ? arguments.callee(val) : val; // 使用arguments.callee解除与函数名的耦合
    }
    }
    return newObj;
    };
    这种方法也就使封装最好的深拷贝的方法,以下为解释:

    1、用new obj.constructor ()构造函数新建一个空的对象,而不是使用{}或者[],这样可以保持原形链的继承;
    2、用obj.hasOwnProperty(key)来判断属性是否来自原型链上,因为for..in..也会遍历其原型链上的可枚举属性。
    3、上面的函数用到递归算法,在函数有名字,而且名字以后也不会变的情况下,这样定义没有问题。但问题是这个函数的执行与函数名 factorial 紧紧耦合在了一起。为了消除这种紧密耦合的现象,需要使用 arguments.callee。
    ---------------------
    作者:zuggs_
    来源:CSDN
    原文:https://blog.csdn.net/zuggs_/article/details/84784933
    版权声明:本文为博主原创文章,转载请附上博文链接!

  • 相关阅读:
    妙味——字符串方法2
    妙味——字符串方法
    [LeetCode][JavaScript]Shortest Palindrome
    [LeetCode]Kth Largest Element in an Array
    [LeetCode][JavaScript]Word Ladder
    [LeetCode][SQL]Second Highest Salary
    [LeetCode][JavaScript]Clone Graph
    [LeetCode][JavaScript]Merge k Sorted Lists
    [LeetCode][JavaScript]Merge Two Sorted Lists
    [LeetCode][JavaScript]Valid Sudoku
  • 原文地址:https://www.cnblogs.com/makai/p/11249995.html
Copyright © 2011-2022 走看看