JavaScript 程序中如何利用 new 调用函数

在JavaScript程序中，通过使用new调用函数可以创建一个新的对象实例。当new与函数联合使用时，这个函数被称为构造函数。在内部，new做了三件事情：创建一个空对象、设置该对象的原型链指向构造函数的prototype属性、调用构造函数以便对象可以初始化属性。当构造函数返回的是一个非基本类型（即一个对象）时，会直接返回这个对象，如果返回值不是一个对象（或无返回值），则返回新创建的对象。

例如，假设有一个构造函数Person，用来创建包含姓名和年龄的对象，我们可以通过new Person('Alice', 30)生成Alice的实例。

一、构造函数的定义

构造函数在本质上是普通的函数，但其按照约定以大写字母开头。构造函数通常不返回值或返回this，因为当使用new操作符时，JavaScript会自动返回这个新创建的对象。

例如:

function Person(name, age) {

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

构造函数与普通函数主要的区别在于调用方式。当使用new操作符调用时，它就可以构造一个新的实例对象。

二、使用 new 调用构造函数

在使用new调用构造函数时，构造函数中的this代表一个新创建的对象实例，且这个实例继承自构造函数的prototype。

例如:

const alice = new Person('Alice', 30);

console.log(alice.name); // 输出: Alice
console.log(alice.age);  // 输出: 30

三、原型链和继承

new操作不仅创建了一个新的对象实例，还设置了新对象的原型链。原型链链接到构造函数的prototype属性，这允许实例访问构造函数原型上的方法和属性。

例如:

Person.prototype.greet = function() {

    console.log(`Hello, my name is ${this.name}!`);
};
alice.greet(); // 输出: Hello, my name is Alice!

通过原型链，所有的实例都可以访问在Person.prototype上定义的方法，这是JavaScript中实现继承的主要方式。

四、new 的内部工作机制

当使用new操作符调用函数时，JavaScript执行以下步骤：

1. 创建一个空对象；
2. 将新对象的__proto__属性链接到构造函数的prototype对象；
3. 将构造函数的this绑定到新对象上，以初始化对象；
4. 如果构造函数返回一个对象，则返回该对象；否则返回步骤1创建的新对象。

五、注意事项和最佳实践

• 使用构造函数时始终使用new操作符；如果忘记了new，会导致全局对象（在浏览器中是window）被意外篡改。
• 推荐构造函数以大写字母开头，这有助于区分构造函数和普通函数。
• 使用instanceof操作符检查一个对象是否是特定构造函数的实例，这在调试时非常有用。

例如:

console.log(alice instanceof Person); // 输出: true

在构造函数内避免使用箭头函数，因为箭头函数不绑定自己的this，它会捕获其所处上下文的this值。

六、构造函数与原型的高级话题

构造函数和原型的概念也可以用于实现更复杂的继承模式，比如组合继承、原型式继承和寄生组合继承。

在组合继承中，可以通过在子构造函数中调用Parent.call(this, args...)并设置子构造函数的prototype来实现对父构造函数功能的继承。

七、ES6中的class关键字

ES6引入了class关键字，提供了更接近传统语言的语法来创建对象和实现继承。但在底层，class依旧使用了构造函数和原型的概念。

例如:

class Person {

    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    greet() {
        console.log(`Hello, my name is ${this.name}!`);
    }
}
const bob = new Person('Bob', 25);
bob.greet(); // 输出: Hello, my name is Bob!

尽管class提供了更清晰和更现代的方式来构造对象和实现继承，了解它背后的new、构造函数和原型链依旧重要，因为这些是JavaScript语言的核心概念。

相关问答FAQs：

如何在 JavaScript 程序中使用 new 关键字调用函数？

1. 什么是 new 关键字？
   在 JavaScript 中，new 是一个用来创建对象实例的关键字。通过使用 new 关键字，可以调用一个函数并将其作为构造函数来创建一个新对象。

2. 如何使用 new 关键字调用函数？
   首先，定义一个函数并将其作为构造函数来使用。然后使用 new 关键字来调用该函数，这样就会创建一个新的对象实例。例如，假设我们有一个构造函数叫做 Person：

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

   要创建一个新的 Person 对象实例，可以使用以下代码：

   var john = new Person('John', 25);
   

   这样就会创建一个名为 john 的 Person 对象实例，它具有 name 属性为 'John'，age 属性为 25。

3. new 关键字的工作原理是什么？
   当使用 new 关键字调用函数时，JavaScript 引擎会自动执行以下操作：

   • 创建一个新的空对象。
   • 将新对象的原型设置为构造函数的原型。
   • 将构造函数的 this 值指向新对象。
   • 执行构造函数的代码，对新对象进行初始化。
   • 返回新对象实例。

通过使用 new 关键字调用函数，我们可以方便地创建和初始化对象实例，实现面向对象编程的特性。请记住，在使用 new 关键字调用函数时，函数名要首字母大写，以便与普通函数区分开来。

最后建议，企业在引入信息化系统初期，切记要合理有效地运用好工具，这样一来不仅可以让公司业务高效地运行，还能最大程度保证团队目标的达成。同时还能大幅缩短系统开发和部署的时间成本。特别是有特定需求功能需要定制化的企业，可以采用我们公司自研的企业级低代码平台：织信Informat。 织信平台基于数据模型优先的设计理念，提供大量标准化的组件，内置AI助手、组件设计器、自动化（图形化编程）、脚本、工作流引擎（BPMN2.0）、自定义API、表单设计器、权限、仪表盘等功能，能帮助企业构建高度复杂核心的数字化系统。如ERP、MES、CRM、PLM、SCM、WMS、项目管理、流程管理等多个应用场景，全面助力企业落地国产化/信息化/数字化转型战略目标。 版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们微信：Informat_5 处理，核实后本网站将在24小时内删除。