分析 JS 的数组和对象的各种拷贝总结

- 日理万妓 2022-04-11 13:18 193阅读 0赞

主要的拷贝概念主要分两种：深拷贝和浅拷贝，就是对于堆栈的引用或拷贝，JS中对象分为基本类型和复合（引用）类型，基本类型存放在栈内存，复合（引用）类型存放在堆内存。堆内存用于存放由new创建的对象，栈内存存放一些基本类型的变量和对象的引用变量。(关于JS的堆栈原理，可以查看一下下面链接：[https://blog.csdn.net/sinat\_15951543/article/details/79228675][https_blog.csdn.net_sinat_15951543_article_details_79228675])

数组拷贝的有(arr是需要拷贝的数组)

1.  Array.form(arr) 
2.  \[...arr\]
3.  arr.slice()
4.  arr.concat()

这里用\[...\]来演示一下效果

var arr = [1,2,3,4,5,6,7,8,9,0,[1,2,3,4,5]] 
    arr['hello']='helloworld';
    console.log('arr',arr); 
    //打印 (11) [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, Array(5), hello: "helloworld"]
    var arrCp = [...arr]
    console.log('arrCp ',arrCp ); 
    //打印 (11) [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, Array(5)]
    
    //这里准备修改二级的数组
    arrCp[10][0] = 2 
    console.log('arrCp[10]',arrCp[10]);
    //打印(5) [2, 2, 3, 4, 5];
    console.log('arr[10]',arr[10]);
    //打印(5) [2, 2, 3, 4, 5];

这四种的效果都是一样的，都是一级属性的深拷贝。并且数组的其他属性并不拷贝过来。

对象拷贝的有(obj是需要拷贝的对象)

1.  \{...obj\}
2.  Object.assign( \{\}, obj )

数组对象都能共用，和深层递归拷贝的用法是

JSON.stringfy(JSON.parse())

深拷贝主要分两种，一种是只有一级属性的深拷贝，二级拷贝的还是栈内引用的地址信息。另一种是递归去拷贝每一层的数据。

[https_blog.csdn.net_sinat_15951543_article_details_79228675]: https://blog.csdn.net/sinat_15951543/article/details/79228675