JS中浅拷贝和深拷贝的区别以及深拷贝的实现

https://github.com/Wscats/articles/issues/57 //这篇文章写得特别好

昨天博主在写服务端代码的时候(node)遇到了浅拷贝和深拷贝的问题

假设数据内容如下:

const data = [
    {
        name: "zzw",
        student: [
            {
                name: "张三"
            },
            {
                name: "李四"
            },
            {
                name: "王五"
            }
        ]
    }
];
//我想根据学生的名字把数据分成三条列出来
let arr = [];
data.forEach(e => {
    let json = e.student;
    e.student = [];
    json.forEach(j => {
        e.student = [j];//浅拷贝
                arr.push(e);
    });
});
console.log(...arr);
//但得到结果:
/*
{ name: 'zzw', student: [ { name: '王五' } ] }
 { name: 'zzw', student: [ { name: '王五' } ] }
  { name: 'zzw', student: [ { name: '王五' } ] }
*/
//得到了三个相同的记过,证明push方法是浅拷贝,只是引用了那个值而没有生成新的地址,每次更改都是同一个值造成了每次修改都会修改所有

//再举个栗子
let a = [0,1,2,3,4];
let b = a;
console.log(a===b,a==b);
a[0] = 1;
console.log(a,b);

//得到结果:
/*
true true
[ 1, 1, 2, 3, 4 ] [ 1, 1, 2, 3, 4 ]
*/
//只修改了a的值,b却也跟着一起修改了

//首先我定义了一个数组复制给a,那么此时在栈区就会存在一个名为a,值为该数组存在堆区的地址,
//当我们再将a复制给b时,这时在栈区又生成了一个名为b但值指向的地址和a是相同的
//所以在我们修改a的同时,由于b的值也指向该地址,所以b也一起更改了

//那我们如何解决浅拷贝带来的问题呢?拷贝值的同时生成新的地址
//在这里博主举了几个深拷贝的方法

/*		
		//方法一:转换成JSON字符串指向新的内存地址
/		/let demo = JSON.stringify(e);
        //arr.push(JSON.parse(demo));
        
        //方法二:Jquery的extend方法也可以实现深拷贝
        
        //方法三:Lodash中的clone和cloneDeep方法也可以实现深拷贝
*/

//再提供一个Lodash数组分页的实例
//_.slice(arr,( page - 1 ) * size , size * page )
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值