Javascript中數組的複製

來源:互聯網
上載者:User
原文連結:http://dinguangx.javaeye.com/blog/656130,http://qinglangee.javaeye.com/blog/160888
複製數組:
javascript中操作對象與java一樣採用引用的方式,所以如果通過obj2 = obj1的方式進行數組複製的時候,無論對obj2還是obj1所做的修改都同時影響兩個變數的值,從而引發不願意看到的後果。下面介紹兩種實現簡單數組元素複製的方法。
(1)借用slice()進行數組的複製
slice() 函數可從已有的數組中返回選定的元素。使用文法為:Js代碼
  1. arrObject.slice(start,end); //start,開始位置;end,結束位置  
arrObject.slice(start,end); //start,開始位置;end,結束位置

slice()函數將會返回一個新的數組對象,所以使用slice(0)就可以實現數組的複製.
測試代碼:Js代碼

  1. var  arr = [1,2,3,4];  
  2.   var clone = arr.slice(0);  
  3.   arr.splice(1,2);//刪除從位置1開始的兩個元素  
  4.   alert("arr:" + arr + "\nclone:" + clone);//arr:[1,4]   clone:[1,2,3,4]  
var  arr = [1,2,3,4];  var clone = arr.slice(0);  arr.splice(1,2);//刪除從位置1開始的兩個元素  alert("arr:" + arr + "\nclone:" + clone);//arr:[1,4]   clone:[1,2,3,4]

    Javascript代碼

  1. var a;  
  2. a = new Array("a","b","c","d","e");  
  3. document.write(a.slice(0,3) + "<br>");  
  4. document.write(a.slice(-3,4) + "<br>");  
  5. document.write(a.slice(0,-1) + "<br>");  
  6. document.write(a.slice(1) + "<br>");  
  7. document.write(a.slice(4,3));  
var a;a = new Array("a","b","c","d","e");document.write(a.slice(0,3) + "<br>");document.write(a.slice(-3,4) + "<br>");document.write(a.slice(0,-1) + "<br>");document.write(a.slice(1) + "<br>");document.write(a.slice(4,3));

這個樣本用到了數組(Array)對象的Slice(start,[end])方法,該方法返回一個新數組,包含了源函數從start到 end 所指定的元素,但是不包括end元素,比如a.slice(0,3);如果 start 為負,將它作為 length + start處理,此處  length 為數組的長度,比如a.slice(-3,4),相當於a.slice(2,4)。如果 end 為負,就將它作為 length +  end 處理,此處 length 為數組的長度,比如a.slice(0,-1)。如果省略 end ,那麼 slice 方法將一直複製到源數組結尾,比如a.slice(1)。如果 end 出現在 start 之前,不複製任何元素到新數組中,比如a.slice(4,3)。

(2)借用concat()函數進行數組的複製
concat() 用於進行數組的合并。使用文法為:Js代碼

  1. arrayObject.concat(arrayX,arrayX,......,arrayX)  
arrayObject.concat(arrayX,arrayX,......,arrayX)

concat()用於多個數組的合并,但是返回的結果是一個新的數組,而不再引用用於合并的任何一個數組。可以利用它的這個特性來用一個數組串連空數組或直接不傳參數完成clone的功能.
測試代碼:Js代碼

  1. var  arr = [1,2,3,4];  
  2. var clone = arr.concat();  
  3. arr.splice(1,2);//刪除從位置1開始的兩個元素  
  4. alert("arr:" + arr + "\nclone:" + clone);//arr:[1,4]   clone:[1,2,3,4]  
var  arr = [1,2,3,4];var clone = arr.concat();arr.splice(1,2);//刪除從位置1開始的兩個元素alert("arr:" + arr + "\nclone:" + clone);//arr:[1,4]   clone:[1,2,3,4]

但是,以上兩種數組複製的操作都不適合對數組中包括複雜資料類型的資料,如果數組中包括複雜資料類型的資料,對這些資料的修改仍然會同時影響複製數組與被複製數組。所以它並不是一個徹底的能實現深層複製的處理思路。
測試代碼:Js代碼

  1. var arr = [1,2,[1,2,3],4];  
  2.   var clone = arr.slice(0);  
  3.   arr[2].splice(1,1);//刪除從位置1開始的兩個元素  
  4.   alert("arr:" + arr + "\nclone:" + clone);//arr:[1,2,1,3,4]   clone:[1,2,1,3,4]  
var arr = [1,2,[1,2,3],4];  var clone = arr.slice(0);  arr[2].splice(1,1);//刪除從位置1開始的兩個元素  alert("arr:" + arr + "\nclone:" + clone);//arr:[1,2,1,3,4]   clone:[1,2,1,3,4]

如果想要實現深層的對象複製,可以採用下面這個通用的實現對象複製的函數:Js代碼

  1. 來源:http://www.cnblogs.com/birdshome/archive/2005/03/20/122246.html  
  2.  Object.prototype.clone = function()  
  3.   {  
  4.      var objClone;  
  5.      if ( this.constructor == Object ) objClone = new this.constructor();   
  6.      else objClone = new this.constructor(this.valueOf());   
  7.      for ( var key in this )  
  8.      {  
  9.          if ( objClone[key] != this[key] )  
  10.          {   
  11.              if ( typeof(this[key]) == 'object' )  
  12.              {   
  13.                  objClone[key] = this[key].Clone();  
  14.              }  
  15.              else  
  16.              {  
  17.                  objClone[key] = this[key];  
  18.              }  
  19.          }  
  20.      }  
  21.      objClone.toString = this.toString;  
  22.      objClone.valueOf = this.valueOf;  
  23.      return objClone;   
  24.   } 

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.