JS數組常用方法---8、concat方法
一、總結
一句話總結:
concat方法的作用是將值或者數組拼接成新數組,參數是0到n個值或數組,返回值是合並好的新數組,並且不會影響原數組
作用:將值或者數組拼接成新數組 參數:值或者數組(0個到n個) 返回值:返回合並好的新數組 是否影響原數組:不會改變原數組 //1、concat拼接數組或者值 let arr1=[1,2,3]; let val1=6; let arr2=[7,8,9]; let val2=11; //參數為值和數組混合形式 let new_arr3=arr1.concat(val1,arr2,val2); console.log(new_arr3);
1、concat為什么可以做數組的深度拷貝?
因為concat方法不修改原數組,而是返回新的拼接好的數組
2、concat方法做深度拷貝的不足之處是什么?
當數組內部的值是引用類型例如Array、Object時,還是淺拷貝
//c、concat做深度拷貝的不足 //當數組內部的值是引用類型例如Array、Object時,還是淺拷貝 let arr1=[1,2,3,{name:'悟空',age:13}]; let arr2=arr1.concat();//深拷貝 arr2.push(4,5,6); console.log(arr2); console.log(arr1); arr2[3]['name']='悟凈'; console.log(arr2); console.log(arr1);
二、concat方法
博客對應課程的視頻位置:
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>concat方法</title> 6 </head> 7 <body> 8 <!-- 9 10 concat方法 11 作用:將值或者數組拼接成新數組 12 參數:值或者數組(0個到n個) 13 返回值:返回合並好的新數組 14 是否影響原數組:不會改變原數組 15 --> 16 <script> 17 //1、concat拼接數組或者值 18 // let arr1=[1,2,3]; 19 // let val1=6; 20 // let arr2=[7,8,9]; 21 // let val2=11; 22 // //參數為值形式 23 // let new_arr1=arr1.concat(val1); 24 // console.log(new_arr1); 25 // 26 // //參數為數組形式 27 // let new_arr2=arr1.concat(arr2); 28 // console.log(new_arr2); 29 // 30 // //參數為值和數組混合形式 31 // let new_arr3=arr1.concat(val1,arr2,val2); 32 // console.log(new_arr3); 33 34 //2、concat做數組的深度拷貝 35 /* 36 * 淺度拷貝:復制一層對象的屬性, 37 * 並不包括對象里面的為引用類型的數據, 38 * 當改變拷貝的對象里面的引用類型時, 39 * 源對象也會改變。 40 * 41 * 深度拷貝:重新開辟一個內存空間, 42 * 需要遞歸拷貝對象里的引用, 43 * 直到子屬性都為基本類型。 44 * 兩個對象對應兩個不同的地址, 45 * 修改一個對象的屬性,不會改變另一個對象的屬性。 46 * 47 * */ 48 49 //a、淺拷貝 50 // let arr1=[1,2,3]; 51 // let arr2=arr1;//淺拷貝 52 // arr2.unshift(4,5,6); 53 // console.log(arr2); 54 // console.log(arr1); 55 56 //b、深拷貝 57 // let arr1=[1,2,3]; 58 // let arr2=arr1.concat();//深拷貝 59 // arr2.unshift(4,5,6); 60 // console.log(arr2); 61 // console.log(arr1); 62 63 //c、concat做深度拷貝的不足 64 //當數組內部的值是引用類型例如Array、Object時,還是淺拷貝 65 // let arr1=[1,2,3,{name:'悟空',age:13}]; 66 // let arr2=arr1.concat();//深拷貝 67 // arr2.push(4,5,6); 68 // console.log(arr2); 69 // console.log(arr1); 70 // 71 // arr2[3]['name']='悟凈'; 72 // console.log(arr2); 73 // console.log(arr1); 74 75 76 </script> 77 </body> 78 </html>