码迷,mamicode.com
首页 > Web开发 > 详细

JS实现深拷贝

时间:2020-07-22 11:44:20      阅读:88      评论:0      收藏:0      [点我收藏+]

标签:cti   var   前端   tar   func   ==   深拷贝和浅拷贝   fun   拷贝   

    我们知道,JS中的=运算符实现的只是浅拷贝,默认的各种方法只是实现了第一层深拷贝,再深层也是浅拷贝。

所以实现深拷贝的方法,就是进行递归,然后拷贝。

    首先,实现一个浅拷贝:

function cloneShallow(source) {
    var target = {};
    for (var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {
            target[key] = source[key];
        }
    }
    return target;
}

// 测试用例
var a = {
    name: "zzsealy",
    book: {
        title: "learnJS",
        price: "45"
    },
    a1: undefined,
    a2: null,
    a3: 123
}
var b = cloneShallow(a);

a.name = "前端进阶";
a.book.price = "55";

console.log(b);
// { 
//   name: ‘zzsealy‘, 
//   book: { title: ‘laernJS‘, price: ‘45‘ },
//   a1: undefined,
//   a2: null,
//   a3: 123
// }

  深拷贝和浅拷贝的实现区别,就是深拷贝进行了递归:

function cloneDeep1(source) {
    var target = {};
    for(var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {
            if (typeof source[key] === ‘object‘) {
                target[key] = cloneDeep1(source[key]); // 注意这里 进行了递归。
            } else {
                target[key] = source[key];
            }
        }
    }
    return target;
}

// 使用上面测试用例测试一下
var b = cloneDeep1(a);
console.log(b);
// { 
//   name: ‘muyiy‘, 
//   book: { title: ‘learnJS‘, price: ‘45‘ }, 
//   a1: undefined,
//   a2: {},
//   a3: 123
// }

 

JS实现深拷贝

标签:cti   var   前端   tar   func   ==   深拷贝和浅拷贝   fun   拷贝   

原文地址:https://www.cnblogs.com/dairuiquan/p/13358868.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!