js數(shù)組直接賦值的問題(js數(shù)組的淺拷貝與深拷貝方法)
更新時間：2022年10月15日 09:02:56 作者：子夜_秋
JS數(shù)組在直接賦值時屬于數(shù)組的淺拷貝，新數(shù)組保存的是原數(shù)據的內存地址，修改新數(shù)組或原數(shù)組其中一個數(shù)組，另一個數(shù)組也會相應的變化，數(shù)組的直接賦值屬于數(shù)組的淺拷貝，JS存儲對象都是存內存地址
1、數(shù)組的直接賦值屬于數(shù)組的淺拷貝，JS存儲對象都是存內存地址，所以淺拷貝會導致新數(shù)組和舊數(shù)組共用同一塊內存地址，其中一個數(shù)組變化，另一個數(shù)組也會相應的變化。
var a =[1,2,3]; var b=a; a[0]=30; console.log(a,b); //結果： [30, 2, 3] [30, 2, 3]
2、數(shù)組內部不含有引用類型，使用slice() 、concat() 和 assign() 方法都屬于數(shù)組的深拷貝，一個數(shù)組變化，另一個數(shù)組不受影響。
數(shù)組的concat方法
var a=[1,2,3]; var b=[].concat(a); a[0]=30; console.log(a,b); //結果：[30, 2, 3] [1, 2, 3]
使用es6的展開操作符： …arr
var a=[1,2,3]; var b=[].concat(a); var c=[...a]; a[0]=30; console.log(a,b,c); //結果：[30, 2, 3] [1, 2, 3] [1, 2, 3]
利用split join map方法
let arr1=[1,2,3];
var newArr4 = arr1.join(" ").split(" ").map(function(i){
return parseInt(i);
});
arr1[0]=30;
console.log(arr1,newArr4);
//VM1175:1 (3) [30, 2, 3] (3) [1, 2, 3]3、數(shù)組內部含有引用類型，使用slice() 、concat() 和 assign() 方法，非引用類型的值屬于深拷貝，引入類型的值屬于淺拷貝，一個數(shù)組變化，另一個也會相應的變化。
4、深拷貝就是指完全的拷貝一個對象，即使嵌套了對象，兩者也相互分離，修改一個對象的屬性，也不會影響另一個。
1、通過JSON.stringify轉化成字符串再通過JSON.parse()解析成原數(shù)組。
let arr=[{a:1,b:2},{a:3,b:4}];
let arr1=JSON.parse(JSON.stringify(arr));
arr[0].a=10;
console.log(arr,arr1);
//輸出結果如下
(2)?[{…}, {…}]
0: {a: 10, b: 2}
1: {a: 3, b: 4}
(2)?[{…}, {…}]
0: {a: 1, b: 2}
1: {a: 3, b: 4}2、利用jQuery的$.extend方法。
let arr=[{a:1,b:2},{a:3,b:4}];
let arr1=$.extend(true,[],arr);
arr[0].a=10;
console.log(arr,arr1);
//輸出結果如下
(2) [{…}, {…}]
0: {a: 10, b: 2}
1: {a: 3, b: 4}
(2) [{…}, {…}, contains: ?, each: ?, uniquelize: ?]
0: {a: 1, b: 2}
1: {a: 3, b: 4}更多關于js數(shù)組直接賦值的問題和js數(shù)組的淺拷貝，深拷貝方法請查看下面的相關文章
相關文章
這篇文章主要介紹了JavaScript的函數(shù)式編程基礎指南,雖然JavaScript被許多人一再強調面向對象,但js中卻沒有類,而本文所展現(xiàn)的函數(shù)主導的js編程則同樣可以很爽,需要的朋友可以參考下2016-03-03
本文主要介紹javascript中的Math對象的用法，講解的很詳細，希望能給大家做一個參考。2016-06-06
js判斷兩個變量是否相等的一些操作符的比較。2009-03-03
對象的類型：本地對象(1)...2006-12-12
javascript中interval與setTimeOut的區(qū)別示例介紹
這篇文章主要介紹了javascript中interval與setTimeOut的區(qū)別,需要的朋友可以參考下2014-03-03
Javascript中的作用域鏈、閉包、原型繼承、eval等特性，在提供各種神奇功能的同時也帶來了各種效率問題，用之不慎就會導致執(zhí)行效率低下2013-11-11
這篇文章主要介紹了javascript 實現(xiàn)原路返回的方法,需要的朋友可以參考下2015-01-01
javaScript中兩個等于號和三個等于號之間的區(qū)別介紹
這篇文章主要介紹了javaScript中兩個等于號和三個等于號之間的區(qū)別，還不知道的朋友可以學習下2014-06-06
返回指定對象的原始值。2008-12-12
Javascript中eval函數(shù)的使用方法與示例
JavaScript有許多小竅門來使編程更加容易。其中之一就是eval()函數(shù)，這個函數(shù)可以把一個字符串當作一個JavaScript表達式一樣去執(zhí)行它。以下是它的說明2007-04-04