在 ECMAScript 2015 中，引入了 Class 关键字来支持面向对象编程的方式。Class 则提供了一种基于原型继承的封装机制。本文将介绍如何在 JavaScript 中使用 Class 来实现继承，并介绍一些技巧和最佳实践。
定义和继承 Class
Class 本质上是 JavaScript 原型继承的语法糖。要定义一个 Class，我们使用关键字 class。例如，下面是定义一个 Person 类的例子：
-- -------------------- ---- -------
----- ------ -
---------------------- --------- -
-------------- - ----------
------------- - ---------
-
------------- -
------ -------------- - - - - --------------
-
-上面这个例子中，我们使用 class 关键字来定义一个名为 Person 的类。构造函数 constructor 用于初始化 firstName 和 lastName 两个实例属性。类也可以定义一组方法，例如 getFullName() 方法。
通过 new 关键字实例化 Person 类后，我们可以调用 getFullName() 方法来获取实例的全名。例如：
const person = new Person('John', 'Doe');
console.log(person.getFullName()); // 输出：John Doe我们也可以使用 extends 关键字来实现类的继承。例如，下面是定义一个 Student 类并继承 Person 类的例子：
-- -------------------- ---- -------
----- ------- ------- ------ -
---------------------- --------- ---------- -
---------------- ----------
-------------- - ----------
-
-------------- -
------ ---------------
-
-在上面这个例子中，我们使用 extends 关键字来实现 Student 类对 Person 类的继承。super() 方法可以调用父类的构造函数，并将 firstName 和 lastName 两个参数传递给父类的构造函数。类还定义了一个 getStudentId() 方法。
通过 new 关键字实例化 Student 类后，我们可以调用 getFullName() 和 getStudentId() 方法来获取实例的全名和学号。例如：
const student = new Student('John', 'Doe', '1234');
console.log(student.getFullName()); // 输出：John Doe
console.log(student.getStudentId()); // 输出：1234子类重写父类方法
子类可以重写父类的方法，从而实现自定义实现。例如，下面是重写 Person 类的 getFullName() 方法的例子：
-- -------------------- ---- -------
----- ------- ------- ------ -
---------------------- --------- ---------- -
---------------- ----------
-------------- - ----------
-
------------- -
------ -------- - - --------------------
-
-------------- -
------ ---------------
-
-在上面这个例子中，我们使用 getFullName() 方法来重写父类的方法。同时，使用 super.getFullName() 调用父类同名方法，以便重用父类的实现。
通过 new 关键字实例化 Student 类后，我们可以调用 getFullName() 和 getStudentId() 方法来获取实例的全名和学号。例如：
const student = new Student('John', 'Doe', '1234');
console.log(student.getFullName()); // 输出：Student John Doe
console.log(student.getStudentId()); // 输出：1234静态方法和属性
Class 也支持定义静态方法和属性。静态方法和属性是属于类本身的，而不是类的实例。例如，下面是定义 Person 类的静态方法和属性：
-- -------------------- ---- -------
----- ------ -
------ ----------- - ----- -- - ---------
---------------------- --------- -
-------------- - ----------
------------- - ---------
-
------ ---------------- -
------ -------------------
-
------------- -
------ -------------- - - - - --------------
-
-在上面这个例子中，我们使用 static 关键字来定义了一个静态属性和一个静态方法。在 getDescription() 方法中，我们使用类名 Person 来引用静态属性 description。
我们可以通过 Person.getDescription() 方法来获取静态属性 description 的值，如下所示：
console.log(Person.getDescription()); // 输出：This is a person.
Getter 和 Setter
Class 支持使用 get 和 set 关键字来定义属性的 Getter 和 Setter。Getter 和 Setter 允许我们以面向对象的方式访问和修改类的属性。例如，下面是在 Person 类中定义 Getter 和 Setter 的例子：
-- -------------------- ---- -------
----- ------ -
---------------------- --------- -
-------------- - ----------
------------- - ---------
-
--- ------ -
------ -------------- - - - - --------------
-
--- ----------- -
----- ------ - ------------- ---
-------------- - ----------
------------- - ----------
-
-在上面这个例子中，我们使用 get name() 和 set name(value) 方法来定义了 Person 类的属性 name 的 Getter 和 Setter。Getter 方法返回实例的全名，而 Setter 方法则使用传递的新值来更新实例的属性。
我们可以使用类似于访问普通属性的方式来使用 name 属性和 name = newValue 表达式访问 Getter 和 Setter。例如，下面是使用 Person 类的 Getter 和 Setter 的例子：
const person = new Person('John', 'Doe');
console.log(person.name); // 输出：John Doe
person.name = 'Bob Smith';
console.log(person.name); // 输出：Bob Smith总结
在本文中，我们介绍了如何在 ECMAScript 2015 中使用 Class 来实现继承，并介绍了一些技巧和最佳实践。我们可以使用 extends 关键字来实现继承，使用 super() 方法来调用父类的构造函数，使用 get 和 set 关键字来定义属性的 Getter 和 Setter。同时，重写父类的方法和定义静态方法和属性也是很有用的技巧。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64ad3d8148841e98949664ef