看了这个还搞不清new发生了什么,就来锤我

80 阅读1分钟

先来看一个栗子:

function Person(name, age) {
         this.name = name;
         this.age = age;
}
 var person = new Person("constRen"28)

image.png

是不是不明白?没关系,我们接着往下看

原理(也就是 new 的过程发生了什么):

  • new 关键字调用时,会创建一个新的内存空间 (创建一个空对象)
  • 函数体内部的 this 指向该内存 ( this 指向这个空对象)
  • 执行函数体内的代码(为这个新对象添加属性)
  • 返回新对象

拆解开来就是这样的

1、创建一个空对象( new 帮你做了)

var obj = new Object()

2、让 Person 中的 this 指向 objnew 会帮你做,还帮你设置原型链,将 obj__proto__ 成员指向了 Person 函数对象的 prototypenew 为了知道原型在哪,所以指定原型的名字为 prototype

var result = Person.call(obj)
obj.__proto__ = Person.prototype

3、并执行 Person 的函数体。

this.name = name;
this.age = age; 

4、返回新对象 ( new 会帮你做)

 return obj

image.png

等同于: 上面的 new 帮忙做了

image.png

function Student(name, chengji) {
    console.log('this', this);  // 这个this的指向  现在都会了吧?
    this.name = name;
    this.chengji = chengji;
    this.go = function () {
        console.log('this1', this); // 这儿也会了吧?
        console.log('姓名:' + this.name + ' 成绩:' + this.chengji);
    }
}
let std1 = new Student('狂徒张三', 98);
let std2 = new Student('背锅李四', 70);
std1.go();
std2.go();