在 ES6 中，我们可以使用类来创建对象，而类与类之间也可以进行继承。但是在继承过程中，我们可能会遇到一些问题，比如父类的属性没有被正确继承，或者子类的构造函数没有被正确调用。本文将介绍如何解决这些问题，让你更加轻松地使用 ES6 中的类的继承功能。
父类属性没有被正确继承
在 ES6 中，我们可以通过 extends 关键字来实现类的继承。例如下面的代码：
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
-
-
----- --- ------- ------ -
----------------- ------ -
------------
---------- - ------
-
-
----- --- - --- --------- -------
---------------------- -- ----
----------------------- -- -----在上面的代码中，Dog 类继承了 Animal 类，并在构造函数中调用了 super 方法来调用父类的构造函数。然而，如果我们在父类中定义了一些属性，并且在子类中没有重新定义这些属性，那么这些属性就没有被正确地继承下来。例如下面的代码：
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
--------- - ---------
-
-
----- --- ------- ------ -
----------------- ------ -
------------
---------- - ------
-
-
----- --- - --- --------- -------
---------------------- -- ---------在上面的代码中，Animal 类中定义了一个 type 属性，但是在 Dog 类中没有重新定义这个属性。因此，当我们创建一个 Dog 的实例时，这个实例并没有继承到 type 属性。
要解决这个问题，我们可以在子类的构造函数中调用 super 方法，然后手动将父类的属性复制到子类中。例如下面的代码：
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
--------- - ---------
-
-
----- --- ------- ------ -
----------------- ------ -
------------
---------- - ------
--------- - -----------
-
-
----- --- - --- --------- -------
---------------------- -- --------在上面的代码中，我们在 Dog 类的构造函数中手动将父类的 type 属性复制到子类中。这样，当我们创建一个 Dog 的实例时，这个实例就可以正确地继承到 type 属性了。
子类的构造函数没有被正确调用
在 ES6 中，当我们使用 extends 关键字来实现类的继承时，子类的构造函数会自动调用父类的构造函数。例如下面的代码：
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
-
-
----- --- ------- ------ -
----------------- ------ -
------------
---------- - ------
-
-
----- --- - --- --------- -------
---------------------- -- ----
----------------------- -- -----在上面的代码中，当我们创建一个 Dog 的实例时，Dog 类的构造函数会自动调用 Animal 类的构造函数，并将 name 参数传递给它。
然而，有时候我们可能会手动调用父类的构造函数，而不是让子类的构造函数自动调用它。例如下面的代码：
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
-
-
----- --- ------- ------ -
----------------- ------ -
---------- - ------
----------------- ------
-
-
----- --- - --- --------- -------
---------------------- -- ----
----------------------- -- -----在上面的代码中，我们手动调用了 Animal 类的构造函数，并将 name 参数传递给它。然而，这样做会导致一些问题。首先，子类的原型链上就没有了父类的实例。其次，如果父类的构造函数中有一些初始化操作，那么这些操作就不会被执行了。
要解决这个问题，我们可以使用 Reflect.construct 方法来手动调用父类的构造函数。例如下面的代码：
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
-
-
----- --- ------- ------ -
----------------- ------ -
--------
---------- - ------
------------------------- ------- ------------------
-
-
----- --- - --- --------- -------
---------------------- -- ----
----------------------- -- -----在上面的代码中，我们使用 Reflect.construct 方法来手动调用父类的构造函数。这样做不仅可以保证子类的原型链上有父类的实例，而且可以保证父类的构造函数中的初始化操作也会被执行。
总结
在 ES6 中，我们可以使用类来创建对象，并且类与类之间也可以进行继承。在继承过程中，我们可能会遇到一些问题，比如父类的属性没有被正确继承，或者子类的构造函数没有被正确调用。为了解决这些问题，我们可以手动将父类的属性复制到子类中，或者使用 Reflect.construct 方法来手动调用父类的构造函数。通过这些方法，我们可以更加轻松地使用 ES6 中的类的继承功能。
示例代码
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
--------- - ---------
-
-
----- --- ------- ------ -
----------------- ------ -
------------
---------- - ------
--------- - -----------
------------------------- ------- ------------------
-
-
----- --- - --- --------- -------
---------------------- -- ----
----------------------- -- -----
---------------------- -- --------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/657e53abd2f5e1655d929d59