当使用new操作符调用构造函数时会发生什么?

357 阅读1分钟

当我们使用new操作符调用构造函数时,函数内部会发生以下三步:

  1. 创建一个空的对象并且this变量引用了该对象,同时还继承了该函数的原型。
  2. 属性和方法都被添加到this引用的对象中。
  3. 新创建的对象由this引用,并且最后隐式的返回this(如果没有显式的返回其他对象)

总结以上几步,用代码表示就像在后台发生了如下的情况:

const Person = function() {
    // 1、创建一个新对象
    // const this = {}; // this为关键字,此处只是模拟该情况
    this.name = 'java';
    this.getName = function() {
        return this.name;
    };
    // return this;
}
const p = new Person();
p.getName() // java

上文说到,当我们在new之后,构造函数会隐式的返回this,前提是我们没有显式的加入return语句,如果我们在构造函数中显式的加入return语句会发生什么啥呢? 在下面的例子中,self引用了新的对思,并且返回了self所引用的对象。

const Person = function() {
    this.name = 'java';
    // 创建并返回一个新的对象
    const self = {};
    self.name = 'python'return self;
};
const p = new Person();
p.name // python

正如上所见,可以在构造函数中返回任意对象,只要它是一个对象。