详解Javascript中new()到底做了些什么？

详解Javascript中new()到底做了些什么？

new是Javascript中一个非常重要的关键字，它实际上是用来创建对象实例的。在使用new关键字创建对象实例的时候，new做了以下几件事情：

1. 创建一个新的对象，并且将这个新的对象的原型链指向构造函数的原型对象。
2. 将这个新的对象作为构造函数的上下文对象(this)来调用构造函数，并传递参数。
3. 如果构造函数返回的值是一个对象，那么这个新的对象就会被直接返回，否则，就返回这个新的对象。

下面用一个简单实例来说明上面的过程：

function Person(name, age) {
  this.name = name;
  this.age = age;
}

let person1 = new Person('Tom', 18);

在上述的代码中，我们创建了一个Person的构造函数，然后使用new关键字来创建一个新的Person对象实例。

在这个过程中，new做了以下几件事情：

1. 创建一个新的对象实例，我们可以称之为person1。
2. 将person1的原型链指向Person.prototype，这样person1就可以访问Person.prototype中定义的属性和方法了。
3. 将Person函数作为上下文对象(this)来调用，同时传递参数'Tom'和18。
4. 在构造函数中，我们将参数'Tom'和18分别赋值给了person1的name和age属性。
5. 新的对象实例person1被返回，也就是说，如果我们在Person构造函数中加上return语句，那么会直接返回这个return语句所指定的对象，而不是返回person1。

接下来，我们再用一个稍微复杂一些的示例来进一步说明new关键字的执行过程。在这个示例中，我们将构造函数对象和原型对象分别保存在了变量中，以便于更好地理解。

let Animal = function(name, age) {
  this.name = name;
  this.age = age;
}

let AnimalPrototype = {
  speak: function() {
    console.log(this.name + ' is speaking!');
  }
}

Animal.prototype = AnimalPrototype;

let animal1 = new Animal('Bob', 2);
let animal2 = new Animal('Mike', 4);

animal1.speak(); // Bob is speaking!
animal2.speak(); // Mike is speaking!

首先，我们定义了一个Animal构造函数，并且将它的原型链指向了一个AnimalPrototype对象。然后，我们创建了两个Animal对象实例animal1和animal2，并且分别调用了它们的speak方法。

在这个示例中，new关键字做了以下几件事情：

1. 创建一个新的对象实例，我们可以称之为animal1。
2. 将animal1的原型链指向AnimalPrototype对象。
3. 将Animal函数作为上下文对象(this)来调用，同时传递参数'Bob'和2。
4. 在构造函数中，我们将参数'Bob'和2分别赋值给了animal1的name和age属性。
5. 返回新的对象实例animal1。
6. 创建一个新的对象实例，我们可以称之为animal2。
7. 将animal2的原型链指向AnimalPrototype对象。
8. 将Animal函数作为上下文对象(this)来调用，同时传递参数'Mike'和4。
9. 在构造函数中，我们将参数'Mike'和4分别赋值给了animal2的name和age属性。
10. 返回新的对象实例animal2。
11. 调用animal1和animal2对象的speak方法，输出相应的结果。

通过这两个示例，我们可以更好地理解new关键字的执行过程以及它所做的事情。在日常开发中，我们会经常使用new关键字来创建对象实例，因此了解new的工作原理是非常重要的。