new 實際上在做什麼?

比我們想的都還簡單

簡述

其實 new 背後做的事情很簡單:

  1. 建立一個空物件
  2. 把空物件丟到 constructor 裡面執行
  3. __proto__ 指向對應的 prototype
  4. 回傳 instance

附註:要理解這個範例要先理解 apply 或 call 的用法,可以參考 function 中的 call apply bind

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function Person(name, age) {
this.name = name
this.age = age
}
Person.prototype.log = function () {
console.log(this.name + ', ' + this.age)
}

function newInstance(Constructor, arguments) {
const obj = {}
// 執行 Constructor,並把 this 指向 obj
Constructor.apply(obj, arguments)
// 設定 __proto__ 對應到哪個 prototype
obj.__proto__ = Constructor.prototype
// 回傳 instance
return obj
}

// 因為是 apply 所以參數要用陣列來傳入
const peanu = newInstance(Person, ['peanu', 23])
// peanu, 23
peanu.log()
物件導向之繼承 理解原型鍊的運作
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×