自然常數e的由來以及計算機為什麼是二進位制

阿新 • • 發佈：2022-05-21

淺拷貝和深拷貝只針對引用型別

淺拷貝

淺拷貝：拷貝的是地址

如果是一層物件，不相互影響，如果出現多層物件拷貝還會相互影響

拷貝物件之後，裡面的屬性值是簡單資料型別直接拷貝值

如果屬性值是引用資料型別則拷貝的是地址

總結：

如果是簡單資料型別拷貝值，引用資料型別拷貝的是地址 (簡單理解：如果是單層物件，沒問題，如果有多層就有問題)

常見方法：

拷貝物件：Object.assgin() / 展開運算子 {...obj} 拷貝物件
拷貝陣列：Array.prototype.concat() 或者 [...arr]

直接賦值和淺拷貝區別：

直接賦值的方法，只要是物件，都會相互影響，因為是直接拷貝物件棧裡面的地址

淺拷貝：如果是一層物件，不相互影響，如果出現多層物件拷貝還會相互影響

// 淺拷貝：只拷貝最外面一層
const obj = {
  uname : '小明',
  age : 18,
  gender : 'man',
  color : ['red', 'green', 'yellow'],
  family : {
    mother : 'mama',
    father : 'baba'
  }
}
// const o = {}

// 基本型別，棧中存的是資料，拷貝的也是資料
// 引用資料型別,棧中存的是資料在記憶體中的地址，拷貝的也是地址

// 方法1:遍歷
// 有該屬性就修改屬性值，沒有該屬性就新增屬性
//// o['uname'] = obj['uname']
// for (const key in obj) {
//   o[key] = obj[key]  
// }

// 方法2：Object靜態方法：assign:將後面物件中的成員新增到前面物件（修改/新增）
// Object.assign(o,obj)

// 方法3：擴充套件運算子
const o = {...obj}


// 如果是簡單資料型別拷貝值，引用資料型別拷貝的是地址 
// (簡單理解： 如果是單層物件，沒問題，如果有多層就有問題)
o.age = 20
o.color[0] = 'pink'
o.family.mother = '媽媽'
console.log(o, obj)

深拷貝

深拷貝：拷貝的是物件，不是地址

常見方法

通過遞迴實現深拷貝

函式遞迴：

如果一個函式在內部可以呼叫其本身，那麼這個函式就是遞迴函式

簡單理解:函式內部自己呼叫自己, 這個函式就是遞迴函式

遞迴函式的作用和迴圈效果類似

由於遞迴很容易發生“棧溢位”錯誤（stack overflow），所以必須要加退出條件 return

let num = 1

function fn () {

  console.log(`第${num}次列印`)

  if(num >= 6) {
    return
  }

  num++

  fn()
}

fn()

遞迴實現深拷貝

const obj = {
  uname : '小明',
  age : 18,
  gender : 'man',
  color : ['red', 'green', 'yellow'],
  family : {
    mother : 'mama',
    father : 'baba'
  }
}

const o = {}

// 利用遞迴
function deepCopy (newObj, oldObj) {

  for (const key in oldObj) {
    //  oldObj[key] : 當前屬性對應的屬性值
    // 必須先檢視陣列，因為陣列屬於物件，物件不一定是陣列
    // 檢視原型鏈中是否包含陣列  
    if (oldObj[key] instanceof Array){
      // 如果oldObj[key] 是陣列，那麼newObj[key]也得是陣列
      newObj[key] = []
      deepCopy(newObj[key], oldObj[key])
      
    } else if (oldObj[key] instanceof Object){
      // 如果oldObj[key] 是物件，那麼newObj[key]也得是物件
      newObj[key] = {}
      deepCopy(newObj[key], oldObj[key])

    }
    else {
      // 如果oldObj[key] 是基本資料型別，直接賦值
      newObj[key] = oldObj[key]
    }
  }
}

deepCopy(o, obj)

o.age = 20
o.color[0] = 'pink'
o.family.mother = '媽媽'
conso

lodash/cloneDeep

利用js庫 lodash裡面的 _.cloneDeep()

語法：const o = _.cloneDeep(obj)

通過JSON.stringify()實現

利用JSON字串轉換

語法：const o = JSON.parse(JSON.stringify(obj))

<script src="./js/lodash.min.js"></script>
<script>
  const obj = {
    uname : '小明',
    age : 18,
    gender : 'man',
    color : ['red', 'green', 'yellow'],
    family : {
      mother : 'mama',
      father : 'baba'
    }
  }

  // 利用js庫 lodash裡面的 _.cloneDeep()
  // const o = _.cloneDeep(obj)

  //利用JSON字串轉換
  const o = JSON.parse(JSON.stringify (obj))

  o.age = 20
  o.color[0] = 'pink'
  o.family.mother = '媽媽'
  console.log(o, obj)//o,obj互不影響
</script>