亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專(zhuān)欄INFORMATION COLUMN

js的淺拷貝和深拷貝和應(yīng)用場(chǎng)景

lavor / 1585人閱讀

摘要：而大多數(shù)實(shí)際項(xiàng)目中，我們想要的結(jié)果是兩個(gè)變量初始值相同互不影響。所以就要使用到拷貝分為深淺兩種深淺拷貝的區(qū)別淺拷貝只復(fù)制一層對(duì)象的屬性，而深拷貝則遞歸復(fù)制了所有層級(jí)。

為什么會(huì)用到淺拷貝和深拷貝

首先來(lái)看一下如下代碼

let a = b = 2
a = 3
console.log(a)
console.log(b)
let c = d = [1,2,3]
let e = f = {a:1,b:2,c:3}
c[0] = 2
e.a = 2
console.log(d[0])
console.log(f.a)

你會(huì)發(fā)現(xiàn)，同一個(gè)Array或者Object賦值給兩個(gè)不同變量時(shí)，變量指向的是同一個(gè)內(nèi)存地址，所以就會(huì)造成其中一個(gè)變量改變屬性值，同時(shí)改變了另外一個(gè)變量的對(duì)應(yīng)屬性值。

而大多數(shù)實(shí)際項(xiàng)目中，我們想要的結(jié)果是兩個(gè)變量（初始值相同）互不影響。所以就要使用到拷貝（分為深淺兩種）
深淺拷貝的區(qū)別 
淺拷貝只復(fù)制一層對(duì)象的屬性，而深拷貝則遞歸復(fù)制了所有層級(jí)。
淺拷貝有效性針對(duì)的是單一層級(jí)對(duì)象 [1,2,3]或者{a:1,b:2}
深拷貝有效性針對(duì)的是單層或者多層級(jí)對(duì)象 [1,2,3]或者{a:1,b:2}或者[1,[1],{a:1}]或者{a:[1],b:{c:2}}
淺拷貝

如何實(shí)現(xiàn)

// 數(shù)組
let a = [1,2]
let b = a.slice()
// {}
let e = {a:[1],b:{d:1},2}
let f = Object.create(e)
function shallowCopy (obj) {
    if (typeof obj === "object" && obj !== null) {
        if (Array.isArray(obj)) {
            return obj.slice()
        } else {
            let result = {}
            Object.keys(obj).forEach((item,i) = > {
                console.log(i)
                result[item] = obj[item]
            })
            return result
        }
    } else {
        return obj
    }
}

應(yīng)用場(chǎng)景
對(duì)于一層結(jié)構(gòu)的Array和Object想要拷貝一個(gè)副本時(shí)使用
vue的mixin是淺拷貝的一種復(fù)雜型式

深拷貝

如何實(shí)現(xiàn)

// 利用JSON（它能正確處理的對(duì)象是Number, String, Boolean, Array, 扁平對(duì)象）
let g = JSON.parse(JSON.stringify(obj))
// 適用于
function deepCopy (obj) {
  if (typeof obj === "object" && obj !== null) {
    let objKeys = Object.keys(obj)
    let result
    if (Array.isArray(obj)) {
      result = []
    } else {
      if (obj.constructor === Object) {
        result = {}
      } else {
        return obj
      }
    }
    objKeys.forEach((item) => {
      if (typeof obj[item] === "object" && obj[item] !== null) {
        switch (obj[item].constructor) {
          case Array:
            result[item] = deepCopy(obj[item])
            break
          case Object:
            result[item] = deepCopy(obj[item])
            break
          case Date:
            result[item] = new Date(obj[item])
            break
          case RegExp:
            let attributes = ""
            attributes += obj[item].global ? "g" : ""
            attributes += obj[item].ignoreCase ? "g" : ""
            attributes += obj[item].multiline ? "g" : ""
            result[item] =  new RegExp(obj[item].source, attributes);
            break
          default:
            result[item] = obj[item]
            break
        }
      } else {
        result[item] = obj[item]
      }
    })
    return result
  } else {
    return obj
  }
}

應(yīng)用場(chǎng)景
復(fù)制深層次的object數(shù)據(jù)結(jié)構(gòu)

對(duì)深拷貝的應(yīng)用想法
在實(shí)際工作中是不是用繼承來(lái)實(shí)現(xiàn)更好？需要大家來(lái)討論，提意見(jiàn)

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/51965.html

相關(guān)文章

  • js的淺拷貝和深拷貝和應(yīng)用場(chǎng)景

    摘要：而大多數(shù)實(shí)際項(xiàng)目中，我們想要的結(jié)果是兩個(gè)變量初始值相同互不影響。所以就要使用到拷貝分為深淺兩種深淺拷貝的區(qū)別淺拷貝只復(fù)制一層對(duì)象的屬性，而深拷貝則遞歸復(fù)制了所有層級(jí)。 為什么會(huì)用到淺拷貝和深拷貝 首先來(lái)看一下如下代碼 let a = b = 2 a = 3 console.log(a) console.log(b) let c = d = [1,2,3] let e = f = {a:...

    MartinDai 評(píng)論0 收藏0

  • js的淺拷貝和深拷貝和應(yīng)用場(chǎng)景

    摘要：而大多數(shù)實(shí)際項(xiàng)目中，我們想要的結(jié)果是兩個(gè)變量初始值相同互不影響。所以就要使用到拷貝分為深淺兩種深淺拷貝的區(qū)別淺拷貝只復(fù)制一層對(duì)象的屬性，而深拷貝則遞歸復(fù)制了所有層級(jí)。 為什么會(huì)用到淺拷貝和深拷貝 首先來(lái)看一下如下代碼 let a = b = 2 a = 3 console.log(a) console.log(b) let c = d = [1,2,3] let e = f = {a:...

    nemo 評(píng)論0 收藏0

  • JavaScript中的淺拷貝和深拷貝

    摘要：在中可以通過(guò)添加一個(gè)參數(shù)來(lái)實(shí)現(xiàn)遞歸，調(diào)用就可以實(shí)現(xiàn)一個(gè)深拷貝。利用序列化實(shí)現(xiàn)一個(gè)深拷貝 在JavaScript中，對(duì)于Object和Array這類(lèi)引用類(lèi)型值，當(dāng)從一個(gè)變量向另一個(gè)變量復(fù)制引用類(lèi)型值時(shí)，這個(gè)值的副本其實(shí)是一個(gè)指針，兩個(gè)變量指向同一個(gè)堆對(duì)象，改變其中一個(gè)變量，另一個(gè)也會(huì)受到影響。 這種拷貝分為兩種情況：拷貝引用和拷貝實(shí)例，也就是我們說(shuō)的淺拷貝和深拷貝 淺拷貝（shallow...

    ernest.wang 評(píng)論0 收藏0

  • 實(shí)現(xiàn)JS中的淺拷貝和深拷貝

    摘要：淺拷貝和淺拷貝的問(wèn)題，不僅在日常應(yīng)用中需要注意，而且在面試和筆試中也常被用來(lái)考察應(yīng)聘者，屬于文體兩開(kāi)花的?；緮?shù)據(jù)類(lèi)型引用數(shù)據(jù)類(lèi)型等等基本數(shù)據(jù)類(lèi)型是按值訪問(wèn)的，對(duì)其的拷貝會(huì)直接復(fù)制其值保存在新變量中。方法手工遍歷法方法方法方法方法 淺拷貝和淺拷貝的問(wèn)題，不僅在日常應(yīng)用中需要注意，而且在面試和筆試中也常被用來(lái)考察應(yīng)聘者，屬于文體兩開(kāi)花的points。 什么是深拷貝和淺拷貝呢？ 名稱(chēng) ...

    huangjinnan 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<