web前端入門到實戰：JS中new操作符原始碼實現

首先我們來看一下例項化一個物件做了瀏覽器做了什麼事情

new的四步操作：

1. 建立一個空物件
2. 設定空物件的 proto 屬性繼承建構函式的prototype屬性，也就是繼承建構函式的原型物件上的公有屬性和方法
3. 呼叫建構函式，將建構函式中的this替換為空物件的this，繼承建構函式中的屬性
4. 在函式內部返回一個新物件

web前端開發學習Q-q-u-n： 784783012 ，分享開發工具，零基礎，進階視訊教程，希望新手少走彎路

原始碼實現

function myNew (fun) {
  return function () {
    // 建立一個新物件且將其隱式原型指向建構函式原型
    let obj = {
      __proto__ : fun.prototype
    }
    // 執行建構函式
    fun.call(obj, ...arguments)
    // 返回該物件
    return obj
  }
}
function person(name, age) {
  this.name = name
  this.age = age
}
let obj = myNew(person)(‘chen‘, 18) // {name: "chen", age: 18}