掌握面向对象（OOP）、构造函数模式，助力你的JavaScript编码之旅

前端

2023-12-31 14:20:31

JavaScript面向对象编程（OOP）

JavaScript中的OOP是一种编程范式，它以“对象”为中心，将数据和行为封装在对象中，使用对象之间的交互来构建应用程序。OOP旨在提高代码的可读性、可维护性和可扩展性。

面向对象的三大特性

面向对象编程具有三大特性：封装、继承和多态。

封装：封装是指隐藏对象的属性和实现细节，仅对外提供公共访问方式，将变化隔离，便于使用，提高复用性和安全性。在JavaScript中，封装可以通过使用闭包来实现。
继承：继承是指子类可以继承父类的属性和方法，从而实现代码的复用。继承是多态的前提。在JavaScript中，继承可以通过使用原型链来实现。
多态：多态是指对象可以以不同的方式响应相同的调用，具体表现为子类对象可以重写父类方法，从而实现方法的动态绑定。在JavaScript中，多态可以通过使用原型链和虚方法来实现。

对象和类

对象是具有状态和行为的实体，由属性和方法组成。在JavaScript中，对象可以用对象字面量或构造函数来创建。

类是对象的模板，它定义了对象的属性和方法。在JavaScript中，类可以用类声明或类表达式来创建。

JavaScript构造函数模式

构造函数模式是JavaScript中创建和使用对象的一种常见模式。构造函数模式允许你定义一个类，然后通过该类创建对象。

构造函数的定义和使用

构造函数是一个特殊的函数，它以大写字母开头，在函数内部使用this来引用当前对象。构造函数通常用于初始化对象的属性和方法。

以下是一个构造函数的例子：

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

要使用构造函数创建对象，可以使用new关键字，如下所示：

var person = new Person("John Doe", 30);

上面的代码将创建一个名为person的对象，该对象具有name和age两个属性，分别为"John Doe"和30。

构造函数的原型

每个构造函数都有一个原型对象，原型对象包含该构造函数创建的所有对象共享的属性和方法。

要访问构造函数的原型对象，可以使用prototype属性，如下所示：

Person.prototype

原型对象是一个普通的JavaScript对象，因此可以向原型对象添加属性和方法。

以下是一个向原型对象添加方法的例子：

Person.prototype.greet = function() {
  console.log("Hello, my name is " + this.name);
};

上面的代码向原型对象添加了一个名为greet的方法，该方法可以在任何通过Person构造函数创建的对象上调用。

构造函数的继承

构造函数可以通过继承来共享属性和方法。继承允许你创建一个新的构造函数，该构造函数继承另一个构造函数的属性和方法。

以下是一个构造函数继承的例子：

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

Employee.prototype = Object.create(Person.prototype);