淺談Javascript中深複製_基礎知識

在javascript中，所有的object變數之間的賦值都是傳送位址的，可能有同學會問哪些是object物件。舉例子來說明可能比較好：

複製程式碼 程式碼如下:

typeof(true)    //"boolean"
typeof(1)       //"number"
typeof("1")     //"string"
typeof({})      //"object"
typeof([])      //"object"
typeof(null)    //"object"
typeof(function(){})  //"function"

所以其實我們深複製主要需要處理的對象就是object對象，非object對像只要直接正常的賦值就好。我實現js深複製的想法就是：

遍歷所有該物件的屬性，
如果該屬性是"object"則需要特殊處理，
如果這個object物件比較特殊，是一個數組，那就建立一個新的數組並深複製數組裡的元素
如果這個object物件是個非陣列對象，那直接再對它遞歸呼叫深複製方法即可。
如果不是"object"，則直接正常複製就行。

下面就是我的實現了：

複製程式碼 程式碼如下:

Object.prototype.DeepCopy = function () {
  var obj, i;
  obj = {};

  for (attr in this) {
    if (this.hasOwnProperty(attr)) {
      if (typeof(this[attr]) === "object") {
        if (this[attr] === null) {
          obj[attr] = null;
        }
        else if (Object.prototype.toString.call(this[attr]) === '[object Array]') {
          obj[attr] = [];
          for (i=0; i             obj[attr].push(this[attr][i].DeepCopy());
          }
        } else {
          obj[attr] = this[attr].DeepCopy();
        }
      } else {
        obj[attr] = this[attr];
      }
    }
  }
  return obj;
};

如果瀏覽器支援ECMAScript 5的話，為了深複製物件屬性的所有特性，可以使用

複製程式碼 程式碼如下:

Object.defineProperty(obj, attr, Object.getOwnPropertyDescriptor(this, attr));

來替代

複製程式碼 程式碼如下:

obj[attr] = this[attr];

直接在Object.prototype上實作該方法的好處是，所有物件都會繼承該方法。壞處是某些函式庫也會改寫Object對象，所以有時會發生衝突。這是需要注意的。具體使用方法如下：

複製程式碼 程式碼如下:

Object.prototype.DeepCopy = function () { ... }
var a = { x:1 };
var b = a;
var c = a.DeepCopy();
a.x = 2;
b.x = 3;
console.log(a.x);   //3
console.log(b.x);   //3
console.log(c.x);   //1

以上就是關於深複製的講解了，不過今天既然我們講了深複製，那麼想對應的還有淺複製，我們就來簡單總結下他們之間的異同吧。

淺複製(影子克隆):只複製物件的基本型別,物件型別,仍屬於原先的參考.
深複製(深度克隆):不緊複製物件的基本類別,同時也複製原物件中的物件.就是說完全是新物件產生的.