js 對象 淺拷貝 和 深拷貝


網上發現一個比較好的博客 阮一峰的感覺很不錯推薦大家看看。

http://www.ruanyifeng.com/blog/it/javascript/

接下來看一下這兩個拷貝方法

1.淺拷貝

拷貝就是把父對像的屬性,全部拷貝給子對象。

 下面這個函數,就是在做拷貝:

var Chinese = {
  nation:'中國'
}
var Doctor = {
  career:'醫生'
}  
function extendCopy(p) {
    var c = {};
    for (var i in p) { 
      c[i] = p[i];
    }
    c.uber = p;
    return c;
 }

 

使用的時候,這樣寫:

 var Doctor = extendCopy(Chinese);
  Doctor.career = '醫生';
  alert(Doctor.nation); // 中國

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

請看,現在給Chinese添加一個"出生地"屬性,它的值是一個數組。

Chinese.birthPlaces = ['北京','上海','香港'];

通過extendCopy()函數,Doctor繼承了Chinese。

var Doctor = extendCopy(Chinese);

然后,我們為Doctor的"出生地"添加一個城市:

Doctor.birthPlaces.push('廈門');

看一下輸入結果

  alert(Doctor.birthPlaces); //北京, 上海, 香港, 廈門
  alert(Chinese.birthPlaces); //北京, 上海, 香港, 廈門

結果是兩個的出生地都被改了。

所以,extendCopy() 只是拷貝了基本類型的數據,我們把這種拷貝叫做“淺拷貝”。

2.深拷貝

 因為淺深拷有如此弊端所以我們接下來看一下深拷貝

所謂"深拷貝",就是能夠實現真正意義上的數組和對象的拷貝。它的實現並不難,只要遞歸調用"淺拷貝"就行了。

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 Doctor = deepCopy(Chinese);

現在,給父對象加一個屬性,值為數組。然后,在子對象上修改這個屬性:

Chinese.birthPlaces = ['北京','上海','香港'];
Doctor.birthPlaces.push('廈門');

alert(Doctor.birthPlaces); //北京, 上海, 香港, 廈門
alert(Chinese.birthPlaces); //北京, 上海, 香港

這樣就完成了拷貝;

 

jquery 中$.extend()如同。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM