1. 程式人生 > 實用技巧 >js中new 到底做了什麼?

js中new 到底做了什麼?

  1. 執行 new 一個物件需要經過的過程
    1. 建立一個新的物件
    2. 將建構函式的作用域付給新物件
    3. 為該物件新增屬性
    4. return 該物件
  2. 舉例
// 建構函式寫法
function Parent(name, age) {
    this.name = name
    this.age = age
}
Parent.prototype.say = function() {
    console.log(this.name)
}
let child = new Parent('tutao', 25)

child.say() //  tutao

// class寫法

class Parent1 {
    constructor(name, age) {
        this.name = name
        this.age = age
    }
    say() {
        console.log(this.name)
    }
}
let child1 = new Parent1('tutao', 25)
child1.say() // tutao
  1. 《javascript 模式》解釋:當我們 new 一個構造器,主要有三步:
    1. 建立一個空物件, 將他的引用賦給 this,繼承函式的原型
    2. 通過 this 將將屬性和方法新增至這個物件
    3. 最後返回 this 指向的新物件,也就是例項
  2. 手動按照原理實現一個 new 方法
    const myNew = function (Parent, ...prop) {
		let child = {}  // 建立一個空物件
		child.__proto__ = Parent.prototype  // 空物件的引用賦給this
		Parent.apply(child, prop)  // 屬性和方法新增至新物件
		return child   // return 新物件
	}
    let child = myNew(Parent, 'tutao', 25)
    child.say() // tutao