標籤:script 直接 == 親測 array 淺拷貝 intersect 資料 格式
一、理解深拷貝與淺拷貝
如下代碼,把 a 的值賦給 b ,修改 b 的值會直接修改到 a 的值,這叫淺拷貝。(其實他們修改的是同一個對象)
var a = [1,2,3,4,5];var b = a;b[2] = 100;console.log(a); //[1,2,100,4,5]console.log(b);//[1,2,100,4,5]
把 obj1 的值賦給 obj2 ,修改 obj2 的值,不會影響到 obj1 的值 ,這叫深拷貝
var obj1 = [1,2,3,4,5]var obj2 = [];for(var i = 0; i < obj1.length; i++){obj2.push(obj1[i])}obj2[2] = 100console.log(obj1); //[1,2,3,4,5]console.log(obj2) //[1,2,100,4,5]
二、深度拷貝的多種情況
這裡我列舉以下幾種例子,在以下的拷貝方法裡也會將各種方法做一個比較,例子如下
var obj1 = {name:"張三",age:18}var obj2 = {name:"王五",intersects:{one:"遊泳",two:"看書"},getNum: function(){ return 10;},numArr:["貓","狗","雞"]}var arr1 = [1,2,3,4,5,"六","七"]var arr2 = [{name:"張三",age:18},{name:"王五",age:19}]
方法一:轉為JSON格式
親測:obj1,arr1,arr2 均有效,obj2無效,
原因:這種方法的缺陷是會破壞原型鏈,並且無法拷貝屬性值為function的屬性
var copyObj2 = JSON.parse(JSON.stringify(obj1))copyObj2.name = "哈哈"console.log(obj1) //{name:"張三",age:18}console.log(copyObj2) //{name:"哈哈",age:18}
方法二:採用遞迴的方式
親測均有效
function copy(obj1, obj2) {var obj2 = obj2 || {};for(var name in obj1) {if(typeof obj1[name] === "object") {obj2[name] = (obj1[name].constructor === Array) ? [] : {};copy(obj1[name], obj2[name]);} else {obj2[name] = obj1[name];}}return obj2;}var copyObj2 = {}copyObj2 = copy(obj2,copyObj2);copyObj2.getNum = function(){return "單身狗"}console.log(obj2.getNum()) //10console.log(copyObj2.getNum()) //單身狗
js資料處理-----資料拷貝