js小拔高系列——寫一個(gè)深拷貝

wslongchen 發(fā)布于2019-08-23 12:38 / 1278人閱讀

摘要：實(shí)現(xiàn)首先可以寫一個(gè)殼子函數(shù)，包裹一個(gè)將要反復(fù)遞歸調(diào)用自身的函數(shù)。如果是引用型，將對(duì)應(yīng)的賦值為遞歸拷貝。另外在中需要使用進(jìn)行判斷，因?yàn)槲覀冎幌肟截愖陨淼膶傩浴?/p>

最近想全職當(dāng)碼農(nóng)，面試時(shí)候被問到了深拷貝，我噼里啪啦說了一通，感覺很牛逼，問我自己寫過沒有，我說沒有，但是我可以寫。其實(shí)我很心虛，估計(jì)現(xiàn)場寫會(huì)卡殼。。。。。

思路

深拷貝需要迭代拷貝對(duì)象的所有屬性，如果屬性是引用型：Object,則繼續(xù)遞歸迭代。

實(shí)現(xiàn)

首先可以寫一個(gè)殼子函數(shù)，包裹一個(gè)將要反復(fù)遞歸調(diào)用自身的函數(shù)。

function deepCopy(obj) {
    const handleDeepCopy = obj=>{
       const clonedObj = obj instanceof Array? []:{}
      return clonedObj
    }
    return handleDeepCopy(obj)
}

clonedObj就是即將克隆返回的新對(duì)象
今后會(huì)這么使用它：let newobj = deepCopy(oldobj)
newobj就是經(jīng)過深拷貝的新對(duì)象，這樣在操作newobj的時(shí)候就不會(huì)對(duì)oldobj產(chǎn)生干擾了

接著完善遞歸拷貝邏輯。

用for in迭代數(shù)組和對(duì)象的屬性。（若不用forin迭代，用foreach代碼會(huì)比較多，數(shù)組和對(duì)象的處理方式會(huì)有所不同）

判斷屬性的類型，是否是引用型。

如果是引用型，將clonedObj對(duì)應(yīng)的property賦值為handleDeepCopy（obj[property]）【遞歸拷貝】。

如果不是引用型，直接將clonedObj對(duì)應(yīng)的property賦值為obj[property]。

function deepCopy(obj) {
    const handleDeepCopy = obj=>{
       const clonedObj = obj instanceof Array? []:{}
      // add for in logic here
      for (let keyOrIndex in obj) {
          if(obj[keyOrIndex] instanceof Object) {
              clonedObj[keyOrIndex] = handleDeepCopy(obj[keyOrIndex])
          } else {
              clonedObj[keyOrIndex] = obj[keyOrIndex]
          }
      }
      // for in logic over
      return clonedObj
    }
    return handleDeepCopy(obj)
}

以上邏輯還有疏忽的地方，沒有在開始時(shí)判斷傳進(jìn)的obj究竟是不是一個(gè)引用型，如果不是，就應(yīng)該直接將obj返回。另外在for in中需要使用hasOwnProperty進(jìn)行判斷，因?yàn)槲覀冎幌肟截恛bj自身的屬性。為了節(jié)約篇幅，增加以上邏輯后修改的代碼在：stackblitz