为了账号安全,请及时绑定邮箱和手机立即绑定

数组的深浅拷贝

标签:
JavaScript

1.浅拷贝

如果数组元素是基本类型,就会拷贝一份,互不影响,而如果是对象或者数组,就会只拷贝对象和数组的引用,这样我们无论在新旧数组进行了修改,两者都会发生变化。我们把这种复制引用的拷贝方法称之为浅拷贝


1)concat,slice

var arr=[{a:1},2,'string',undefined];
var newArr1=arr.concat();
var newArr2=arr.slice();
concat跟slice都是复制一个副本,属于浅拷贝,对于数组的拷贝,元素若是对象,拷贝的是对象的引用值,我们无论在新旧数组进行了修改,两者的对象元素都会发生变化
例如:newArr1.a=2;
console.log(arr)//[{a:2},2,'string',undefined];
console.log(newArr1)//[{a:2},2,'string',undefined];
console.log(newArr2)//[{a:2},2,'string',undefined];

2)手动遍历实现

var shallowCopy = function(obj) {
    // 只拷贝对象
    if (typeof obj !== 'object') return;
    // 根据obj的类型判断是新建一个数组还是对象
    var newObj = obj instanceof Array ? [] : {};
    // 遍历obj,并且判断是obj的属性才拷贝
    for (var key in obj) {
        if (obj.hasOwnProperty(key)) {
            newObj[key] = obj[key];
        }
    }
    return newObj;
}

2.深拷贝

深拷贝就是指完全的拷贝一个对象,即使嵌套了对象,两者也相互分离,修改一个对象的属性,也不会影响另一个。


1)利用json序列化


var arr=[{a:1},2,'string',undefined];
var newArr1= JSON.parse(JSON.stringify(arr));
newArr1.a=2;
console.log(arr)//[{a:1},2,'string',undefined];
console.log(newArr1)//[{a:2},2,'string',undefined];
但是有一个问题,不能拷贝函数
var arr=[function(){console.log(1)},{b:function(){console.log(2)}}];
var newArr1= JSON.parse(JSON.stringify(arr));
console.log(arr)//[function(){console.log(1)},{b:function(){console.log(2)}}];
console.log(newArr1)//[null,{}];

2)手动遍历实现

var deepCopy = function(obj) {
    if (typeof obj !== 'object') return;
    var newObj = obj instanceof Array ? [] : {};
    for (var key in obj) {
        if (obj.hasOwnProperty(key)) {
            newObj[key] = typeof obj[key] === 'object' ? deepCopy(obj[key]) : obj[key];
            //判断一下属性值的类型,如果是对象,我们递归调用深拷贝函数
        }
    }
    return newObj;
}


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消