工作日常 js引用型別資料深拷貝與淺拷貝

js資料型別

關於js的淺拷貝和深拷貝

++只有引用資料型別才會有深拷貝和淺拷貝這麼一說。由於js的儲存都是存位址的，淺拷貝會導致obj1和obj2指向同乙個記憶體位址。這麼一來，如果操作其中的任意乙個obj那麼就會導致元記憶體位址的資料更改。所以需要使用到深拷貝，為拷貝出的物件開闢一塊新的記憶體位址。這樣一來，就會出現原物件與新拷貝的物件在不同的記憶體位址。從而達到前後物件相互不影響。++

淺拷貝

陣列的淺拷貝

var oldarray = [1,2,3,4,5,6];
var newarray = ;
newarray = oldarray;
newarray[0] = '改變的元素';
console.log(oldarray); //
'改變的元素',2,3,4,5,6
console.log(newarray); //
'改變的元素',2,3,4,5,6

物件的淺拷貝

function
copyobject
(obj);
for(var item in obj)
return outobj;
}// object.assign() 將元物件的屬性列舉到新的物件，然後返回新的物件
var obj = 
var b = {};
object.assign(b,obj);
if(b === obj)  // true

深拷貝

陣列的concat與slice方法(假裝深拷貝)

++concat與slice方法都是淺拷貝乙個陣列的元素然後拷貝給乙個新的陣列。只是如果陣列的單個元素是數字，字串等簡單資料型別的時候，原陣列的物件不會受新陣列的影響。如果陣列的項是引用型別陣列或物件，則就是淺拷貝。++

var origin = [1,2,3,4,5];
var copyslice = origin.slice(0);
var copyconcat = origin.concat();
copyslice[0] = 'one';
copyconcat[0] = 'concat';
console.log(origin); // [1,2,3,4,5]

var origin = [[1,2,3],];
var copyslice = origin.slice(0);
var copyconcat = origin.concat();
copyslice[0][0] = 'slice';
copyconcat[1].name = 'concat';
console.log(origin) // [['slice',2,3],]

深拷貝實現方法json.parse和json.stringify();

這種方法使用較為簡單，可以滿足基本的深拷貝需求，而且能夠處理json格式能表示的所有資料型別，但是對於正規表示式型別、函式型別等無法進行深拷貝(而且會直接丟失相應的值)。還有一點不好的地方是它會拋棄物件的constructor。也就是深拷貝之後，不管這個物件原來的建構函式是什麼，在深拷貝之後都會變成object。同時如果物件中存在迴圈引用的情況也無法正確處理。

//例1
var source =  } 
var target = json.parse(json.stringify(source));
target.name = "target";  //改變target的name屬性
console.log(source.name); //source 
console.log(target.name); //target
target.child.name = "target child"; //改變target的child 
console.log(source.child.name); //child 
console.log(target.child.name); //target child
//例2
var source = , child: } 
var target = json.parse(json.stringify(source));
console.log(target.name); //undefined
//例3
var source = , child:new
regexp("e") }
var target = json.parse(json.stringify(source));
console.log(target.name); //undefined
console.log(target.child); //object {}

工作日常 js引用型別資料深拷貝與淺拷貝

js中引用資料型別的深拷貝

引用型別及深拷貝

js基本型別與引用型別，淺拷貝和深拷貝

工作日常 js引用型別資料深拷貝與淺拷貝

js中引用資料型別的深拷貝

引用型別及深拷貝

js基本型別與引用型別，淺拷貝和深拷貝

相關推薦