ES6 中的 Class 类和继承是前端开发中的重要知识点，深入理解可提升编码能力、降低开发成本。在本文中，我们将详细介绍 ES6 中的 Class 类和继承。
什么是 Class 类
Class 是 ES6 中新增的一个关键字，用于定义一个类。在 JavaScript 中，传统的类是通过构造函数创建的，而 ES6 中的 Class 是基于原型的，它仅仅是一个语法糖，其实本质上仍然是基于构造函数的。
下面是一个简单的例子：
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}上述代码中，我们定义了一个 Person 类，包含 name 和 age 两个属性，在构造函数中初始化。
Class 继承
Class 的继承可以通过 extends 关键字实现，它可以继承父类的属性和方法，并且可以在子类中对父类的方法进行重写。
下面是一个简单的例子：
-- -------------------- ---- -------
----- ------ -
----------------- ---- -
--------- - -----
-------- - ----
-
----- -
--------------- ---- -- ------------- - -- ----------- ----- -------
-
-
----- ------- ------- ------ -
----------------- ---- ------ -
----------- -----
---------- - ------
-
----- -
--------------- ---- -- ------------- - -- ----------- ----- ---- -------- -- ----- -----------------
-
-
----- - - --- ------------- ----
-------- -- --- ---- -- ---- - -- -- ----- -----
----- - - --- ---------------- --- ---
-------- -- --- ---- -- ------ - -- -- ----- ---- -------- -- ----- ---在上述代码中，我们定义了一个 Person 类和一个 Student 类，Student 类继承了 Person 类。在调用子类的 say 方法时，会覆盖掉父类的 say 方法。
super 关键字
在子类中，如果要访问父类的属性或方法，需要使用 super 关键字。super() 用于调用父类的构造函数，super.xx() 用于调用父类的方法。
下面是一个简单的例子：
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
-
----- -
--------------- ---- -- ----------------
-
-
----- ------- ------- ------ -
----------------- ------ -
------------
---------- - ------
-
----- -
------------
-------------- -- -------- -- ----- -----------------
-
-
----- - - --- -------------- ---
-------- -- --- ---- -- ---- - -- -------- -- ----- ---在上述代码中，我们定义了一个 Student 类，它继承了 Person 类。在子类的 say 方法中，首先调用了 super.say()，输出了父类的 say 方法的返回值，然后再输出了自己的学习年级。
总结
本文中，我们详细介绍了 ES6 中的 Class 类和继承，包括 Class 的基本定义，Class 继承，super 关键字等。深入理解这些知识，可以提升我们的编码能力，降低开发成本。同时，我们也提供了示例代码，供大家参考和学习。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6460a9fa968c7c53b024edd8