JavaScript Class 类

在本教程中，您将了解 JavaScript Class 类以及如何有效地使用它。JavaScript 类是创建对象的蓝图，类封装数据和函数用于操作数据。

与 Java 和 C# 等其他编程语言不同，JavaScript 类是原型继承的语法糖。换句话说，ES6 类只是一些特殊的函数。

回顾 ES6 之前的课程

在 ES6 之前，JavaScript 没有类的概念。要模仿一个类，您通常会使用构造函数/原型模式，如以下示例所示：

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

Person.prototype.getName = function () {
    return this.name;
};

var john = new Person("John Doe");
console.log(john.getName());

输出：

John Doe

代码是如何运行的。

首先，创建 Person 构建函数，它有一个 name 属性。然后在 Person 的原型上创建 getName() 函数，该函数可以被各个 Person 的实例共享。

然后，使用 new 运算符创建 Person 类型的实例。因此，john 对象是通过原型继承的 Person 和 Object 的实例。

以下语句使用 instanceof 运算符检查 john 实例是否是 Person and Object类型：

console.log(john instanceof Person); // true
console.log(john instanceof Object); // true

ES6 类声明

ES6 引入一种用于声明类的语法，如本例所示：

class Person {
    constructor(name) {
        this.name = name;
    }
    getName() {
        return this.name;
    }
}

此 Person 类的行为类似于上一个示例中的 Person 类。但是，它没有使用构造函数/原型模式，而是使用关键词 class。

在 Person 类中，您可以在 constructor()  函数初始化实例的属性。当您实例化类的对象时，JavaScript 会自动调用 constructor()  方法。

下面创建一个新 Person 对象，它会自动调用Person 的 constructor() 方法：

let john = new Person("John Doe");

Person 的 getName() 称为类的方法。与构造函数一样，您可以使用以下语法调用类的方法：

objectName.methodName(args)

例如：

let name = john.getName(); 
console.log(name); // "John Doe"

要验证类是一个函数这一事实，可以使用 typeof 运算符来检查 Person 类的类型。

console.log(typeof Person); // function

它按预期返回 function。

john 对象也是 Person 和 Object 类型的一个实例：

console.log(john instanceof Person); // true
console.log(john instanceof Object); // true

类与自定义类型

尽管类和使用构造函数定义的自定义类型之间存在相似之处，但仍存在一些重要差异。

首先，类声明不像函数声明那样被提升。

例如，如果将以下代码放在 Person 类声明部分的上方，您将获得一个ReferenceError 的错误。

let john = new Person("John Doe");

错误：

Uncaught ReferenceError: Person is not defined

其次，一个类中的所有代码都在严格模式下自动执行。而且您无法更改此行为。

第三，类方法是不可枚举的。如果您使用构造函数/原型模式模拟类的行为，则必须使用 Object.defineProperty() 方法使属性不可枚举。

最后，在没有 new 运算符的情况调用类构造函数将导致错误，如以下示例所示。

let john = Person("John Doe");

错误：

Uncaught TypeError: Class constructor Person cannot be invoked without 'new'

请注意，可以在没有 new 运算符的情况调用构造函数。在这种情况下，构造函数的行为就像一个普通函数。

结论

使用 JavaScript 关键词 class 声明一个类 。声明 class 是原型继承的语法糖，具有额外的增强功能。

myfreax

微信公众号

支付宝打赏