学习如何在 JavaScript 中创建类

2015 年，发布了 JavaScript 编程语言的 ES6 版本。此版本对该语言进行了一些重大升级，并正式将其置于 Java 和 C++ 等其他语言中的面向对象编程语言的类别中。

面向对象的编程关注对象以及可以对它们执行的 *** 作。但是，在您拥有任何对象之前，您需要拥有一个类。

JavaScript 类是该语言的 ES6 版本附带的改变游戏规则的特性之一。类可以描述为用于创建对象的蓝图。

在本教程文章中，您将学习如何使用 JavaScript 类创建和 *** 作对象。

JavaScript 类结构

在 JavaScript 中创建类时，您始终需要一个基本组件——class关键字。JavaScript 类的几乎所有其他方面都不是成功执行所必需的。

如果未提供构造函数，则 JavaScript 类将自然执行（该类将在执行期间简单地创建一个空的构造函数）。但是，如果 JavaScript 类是使用构造函数和其他函数创建的，但没有使用 class 关键字，则该类将无法执行。

class关键字（应该总是小写）在 JavaScript 的类结构中是必需的。以下示例是 JavaScript 类的一般语法。JavaScript 类语法如下：

class ClassName{
//class body
}

在 JavaScript 中创建一个类

在编程中，类可以看作是用于创建专门对象的通用实体。例如，在学校环境中，广义实体（班级）可以是学生，学生的对象可以是 John Brown。但是在创建对象之前，您需要知道它将存储的数据，这就是 JavaScript 构造函数发挥作用的地方。

在 JavaScript 类中使用构造函数

由于以下几个原因，构造函数对于类创建过程至关重要；它初始化对象的状态（通过其属性），并在实例化（定义和创建）新对象时自动调用它。

使用构造函数示例

下面，您将看到一个构造函数示例，其中解释了它的含义。

class Student{
constructor(firstName, lastName, startDate){
this.firstName = firstName;
this.lastName = lastName;
this.startDate = startDate;
}
}

上面的代码展示了 JavaScript 类构造函数的一个重要方面；与 Java 和 C++ 等其他语言不同，JavaScript 的构造函数不使用类名来创建构造函数。如上例所示，它使用构造函数关键字。

有关的：学习如何在 Java 中创建类

上面示例中的构造函数接受三个参数，并使用this关键字将参数分配给类的当前实例。这可能看起来有点令人困惑，但您需要了解的是，一个类可以看作是用于创建许多房屋的蓝图。

然后可以将每个建造的房屋视为此类的对象。尽管这些房屋中的每一个都是使用相同的蓝图创建的，但它们可以通过其特定的地理位置或拥有它们的人来区分。

this关键字用于区分类创建的每个对象。它确保为使用同一类创建的每个对象存储和处理正确的数据。

在 JavaScript 中创建对象

构造函数在 JavaScript 这样的语言中很重要，因为它们表示特定类的对象应具有的属性数量。某些语言会要求先声明属性（变量），然后才能在构造函数或任何其他方法中使用它。但是，JavaScript 并非如此。

有关的：如何在 JavaScript 中声明变量

查看上面的学生类构造函数，可以看出这个类的一个对象将具有三个属性。

创建对象示例

下面，您将看到一个在 JavaScript 中创建对象的示例。

//create a new object
const john = new Student('John', 'Brown', '2018');

上面的代码使用Student类来创建一个对象。

创建类的对象时，您需要使用new关键字，后跟类名和要分配给相应属性的值。现在您有一个新学生，名字为 John，姓氏为 Brown，开始日期为 2018 年。您还有一个常量变量：john。这个变量很重要，因为它允许您使用创建的对象。

如果没有john变量，您仍然可以使用Student类创建一个新对象，但是将无法访问该对象并将其与该类的不同方法一起使用。

在 JavaScript 类中使用方法

方法是类的函数，用于对从该类创建的对象执行 *** 作。添加到学生班级的一种好方法是生成每个学生的报告。

创建类方法示例

下面是在 JavaScript 中创建类方法的示例。

class Student{
constructor(firstName, lastName, startDate){
this.firstName = firstName;
this.lastName = lastName;
this.startDate = startDate;
}
// report method
report(){
return `${this.firstName} ${this.lastName} started attending this institution in ${this.startDate}`
}
}

上面的类包含一个方法，该方法将为使用Student类创建的每个学生生成报告。要使用report()方法，您需要使用该类的现有对象来进行简单的函数调用。

感谢上面的“创建对象示例”，您应该有一个分配给变量john的Student类的对象。使用john，您现在可以成功调用report()方法。

使用类方法示例

下面是在 JavaScript 中使用类方法的示例。

//create a new object
const john = new Student('John', 'Brown', '2018');
//calling the report method and storing its result in a variable
let result = john.report();
//printing the result to the console
console.log(result);

上面的代码使用Student类在控制台中生成以下输出：

John Brown started attending this institution in 2018

在 JavaScript 类中使用静态方法

静态方法是独一无二的，因为它们是 JavaScript 类中唯一可以在没有对象的情况下使用的方法。

从上面的示例中，您不能在没有类对象的情况下使用report()方法。这是因为report()方法依赖于对象的属性来产生理想的结果。但是，要使用静态方法，您只需要存储该方法的类的名称。

创建静态方法示例

下面是 JavaScript 的静态方法示例。

class Student{
constructor(firstName, lastName, startDate){
this.firstName = firstName;
this.lastName = lastName;
this.startDate = startDate;
}
// report method
report(){
return `${this.firstName} ${this.lastName} started attending this institution in ${this.startDate}`
}
//static method
static endDate(startDate){
return startDate + 4;
}
}

从上面的示例中要注意的重要一点是，每个静态方法都以static关键字开头。

使用静态方法示例

下面是在 JavaScript 中使用静态方法的示例。

//calling a static method and printing its result to the console
console.log(Student.endDate(2018));

上面的代码行使用Student类在控制台中生成以下输出：

2022

创建 JavaScript 类很容易

如果您想创建一个 JavaScript 类并从中实例化一个或多个对象，您需要记住几件事：

JavaScript 类必须具有class关键字。JavaScript 构造函数指示对象可以具有的值的数量。没有对象就不能使用通用类方法。静态方法可以在没有对象的情况下使用。

控制台。_ 本文通篇使用log()方法来提供在 JavaScript 类中同时使用通用方法和静态方法的结果。此方法对于任何 JavaScript 开发人员来说都是一个有用的工具，因为它有助于调试过程。

熟悉console.log()方法是作为 JavaScript 开发人员可以做的最重要的事情之一。