数组的深拷贝与浅拷贝 

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6     <title>数组的深拷贝与浅拷贝</title>
 7 </head>
 8 <body>
 9     <script>
10         //数组的浅拷贝
11         var arr1= [1,23,5,1,3];
12         var arr2 = arr1;
13         arr1[0] = 99;
14         console.log(arr1[0]);
15         console.log(arr2[0]);
16         console.log(arr1);
17         console.log(arr2);

18         //数组的深拷贝
19         var arr3 = arr1.concat();  //连接数组，如果连接的是一个空，那么也是返回了新的本身的数组
20         console.log(arr3);
21         arr1[0]= 100;
22         console.log("arr1: "+arr1[0]);
23         console.log("arr3: "+arr3[0]);
24         console.log("arr1: "+arr1);
25         console.log("arr3: "+arr3);
26         
27         var arr4 = arr1.slice(0);  //从0开始到末尾截取数组，然后返回一个新的数组
28         arr1[0]= 88;
29         console.log("arr1: "+arr1[0]);
30         console.log("arr4: "+arr4[0]);
31         console.log("arr1: "+arr1);
32         console.log("arr4: "+arr4);
33 
34         var arr5 = arr1.map(function(value){  //使用map方法遍历数组然后返回新的数组，里面的值不变
35            return value;
36         })
37         arr1[0]= 77;
38         console.log("arr1: "+arr1[0]);
39         console.log("arr5: "+arr5[0]);
40         console.log("arr1: "+arr1);
41         console.log("arr5: "+arr5);
42 
43         var [...arr6] = arr1//ES6扩展运算符实现数组的深拷贝
44         arr1[0]= 66;
45         console.log("arr1: "+arr1[0]);
46         console.log("arr6: "+arr6[0]);
47         console.log("arr1: "+arr1);
48         console.log("arr6: "+arr6);
49 
50     </script>
51 </body>
52 </html>

 

posted @ 2020-05-29 11:23  Running°つ  阅读(230)  评论(0)    收藏  举报