Object.assign 實現原理

Object.assign

方法說明

Object.assign()用於將對象自身全部的可枚舉屬性從一個或者多個源對象上覆制到目標對象

源碼的關鍵點在於

該方法的原理比較簡單，實現的關鍵點在於理解 」方法說明「 中的內容，對照下面的源碼內容和註釋，便可理解和實現

源碼

Object.myAssign = function (target, ...src) {
  for (let i = 0; i < src.length; i++) {
    if (src[i] !== null || src[i] !== undefined) {
      // 過濾掉源對象爲null和undefined的狀況
      for (let key in src[i]) {
        // in運算符會查找原型對象上的可枚舉屬性，因此須要經過Object.prototype.hasOwnProperty方法過濾掉對象原型對象上的屬性
        if (src[i].hasOwnProperty(key)) {
          target[key] = src[i][key]
        }
      } 
    }
  }
  return target
}

// 示例代碼
const proto = { p: 'proto' }
const obj1 = { a: 'aa' }
const obj2 = { b: 'bb' }
// 以proto對象爲新對象的__proto__
const obj3 = Object.create(proto, {
  c: {
    value: 'cc',
    enumerable: true
  }
})
console.log(obj3)  // {c: 'cc'}
// 輸出obj3的構造函數的原型對象
console.log(obj3.__proto__)  // {p: 'proto'}
const t1 = Object.myAssign({}, obj1, obj2)
console.log(t1)  // {a: "aa", b: "bb"}
const t2 = Object.myAssign({}, obj1, null, obj2, undefined)
console.log(t2)  // {a: "aa", b: "bb"}
const t3 = Object.myAssign({}, obj1, obj2, obj3)
console.log(t3)  // {a: "aa", b: "bb", c: "cc"}