1. 程式人生 > >小tips:JS之淺拷貝與深拷貝

小tips:JS之淺拷貝與深拷貝

obj fault tps all function spa html 存在 ||

淺拷貝:

function extendCopy(p) {
 var c = {};
 for (var i in p) {
   c[i] = p[i];
 }
 return c;
}

深拷貝:

function deepCopy(p, c) {
  var c = c || {};
  for (var i in p) {
    if (typeof p[i] === ‘object‘) {
      c[i] = (p[i].constructor === Array) ? [] : {};
      deepCopy(p[i], c[i]);
    } 
else {   c[i] = p[i];     }   }   return c; }

淺拷貝的問題:如果父對象的屬性等於數組或另一個對象,那麽實際上,子對象獲得的只是一個內存地址,而不是真正拷貝,因此存在父對象被篡改的可能。

下面來個實例:

var obj1 = {
    name:‘helloJack‘,
    inner:{
        sum:5
    }
};

var obj2 = extendCopy(obj1,{});

obj2.name ="sss";
obj2.inner.sum = 7;
console.log(obj1.name); 
//helloJack console.log(obj1.inner.sum); //5

存在的問題,如果經常改寫這個函數的方法extendCopy,內部再調用這個方法名就會出錯,還得修改一下這個方法名,那麽下面這樣解決:

var extendCopy = (function f(p,c){
    var c = c || {};
    for (var i in p) {
        if(typeof p[i] === ‘object‘){
            c[i] = (p[i] instanceof Array) ? [] : {};
            f(p[i],c[i]);
        }
else{  c[i] = p[i]; }  } return c; });

可參考地址:
『小tip』JS嚴格模式(use strict)下不能使用arguments.callee的替代方案
Javascript 面向對象編程(一):封裝
Javascript面向對象編程(二):構造函數的繼承
Javascript面向對象編程(三):非構造函數的繼承

小tips:JS之淺拷貝與深拷貝