JS new的时候究竟干了什么？

2023-09-10 19:13:46

揭秘JS中的new操作符

在JavaScript中，没有类的概念，但是我们可以使用函数来生成对象。new操作符就是我们创建对象和实例化类时的得力助手。它可以让我们通过构造函数来创建对象，并为这些对象分配内存空间，同时还能让我们继承父类的属性和方法。

构造函数：对象的蓝图

构造函数在JavaScript中扮演着举足轻重的角色。它就像是一个蓝图，定义了对象应该具备哪些属性和方法。当我们使用new操作符调用构造函数时，就会创建一个新对象，并且这个对象会继承构造函数中的所有属性和方法。

原型：对象的灵魂

在JavaScript中，每个对象都有一个原型，原型是一个特殊的对象，它包含着该对象的所有属性和方法。当我们访问一个对象的属性或方法时，JavaScript会首先在该对象中查找，如果没有找到，它会继续在该对象的原型中查找，依此类推，直到找到为止。

继承：对象的传承

继承是JavaScript中的一种重要机制，它允许子类继承父类的属性和方法。当我们使用new操作符实例化一个子类时，子类会自动继承父类的原型，也就继承了父类的所有属性和方法。

new操作符的幕后故事

当我们使用new操作符调用构造函数时，JavaScript会执行以下一系列步骤：

创建一个新对象。
将该对象设置为构造函数的prototype属性的副本。
将构造函数中的this指向该对象。
执行构造函数中的代码。
返回该对象。

示例：揭秘new操作符的实际应用

为了更好地理解new操作符的实际应用，我们来看一个简单的示例：

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

Person.prototype.greet = function() {
  console.log("Hello, my name is " + this.name + " and I am " + this.age + " years old.");
};

const person1 = new Person("John", 30);
person1.greet(); // 输出: Hello, my name is John and I am 30 years old.

在这个示例中，我们定义了一个Person构造函数，它接收name和age两个参数，并使用this关键字将这两个参数赋值给新创建的对象。我们还为Person构造函数定义了一个prototype属性，该属性包含一个名为greet的方法。当我们使用new操作符实例化Person构造函数时，JavaScript会创建一个新对象，并将其设置为Person.prototype属性的副本。然后，JavaScript将构造函数中的this关键字指向该对象，并执行构造函数中的代码。最后，JavaScript返回该对象，并将其赋值给变量person1。

总结：new操作符在JavaScript中的重要性

new操作符在JavaScript中扮演着举足轻重的角色。它不仅可以让我们创建对象和实例化类，还可以让我们继承父类的属性和方法。通过理解new操作符的幕后故事，我们可以更深入地理解JavaScript中的对象创建机制和继承机制。