TypeScript 是一种基于 JavaScript 的强类型语言，它在 JavaScript 的基础上增加了类型检查和静态代码分析等功能，让 JavaScript 更加强大和可靠。在 TypeScript 中，extends 和 implements 是两个常用的关键字，它们的区别和用法是很多开发者容易混淆和误用的。
extends 和 implements 的基本概念
在 TypeScript 中，extends 用于子类继承父类，它可以继承父类的属性和方法，并且可以添加自己的属性和方法。implements 则是用于类实现接口，它能够强制实现接口中的所有方法和属性。
下面是一个 extends 和 implements 的例子：
-- -------------------- ---- -------
----- ------ -
------ ----- -------
----------------- ------- -
--------- - -----
-
------ -------------- ------ - -- -
------------------------- ----- ----------- ---------
-
-
----- --- ------- ------ -
------ ------ -------
----------------- ------- ------ ------- -
------------
---------- - ------
-
------ ------ -
------------------ --------
-
-
--------- -------- -
------------ -------- -----
-
----- --- ---------- -------- -
------ ------------ ------- -
------------------ -----------
-
-在上面的例子中，Animal 是一个父类，它有一个公共属性 name 和一个公共方法 move。Dog 是 Animal 的子类，它有一个额外的属性 breed 和一个新的方法 bark。Cat 实现了一个 CanSpeak 接口，接口包含一个必须实现的方法 speak。接下来我们会对这些概念进行详细介绍。
extends 的用法
在 TypeScript 中，extends 主要有两个作用：
- 子类继承父类的属性和方法
- 子类可以添加自己的属性和方法
继承父类的属性和方法非常简单，只需要在子类中使用 super 关键字调用父类的构造函数即可：
-- -------------------- ---- -------
----- ------ -
------ ----- -------
----------------- ------- -
--------- - -----
-
------ -------------- ------ - -- -
------------------------- ----- ----------- ---------
-
-
----- --- ------- ------ -
------ ------ -------
----------------- ------- ------ ------- -
------------
---------- - ------
-
-在上面的例子中，Dog 继承了 Animal 的属性和方法，使用 super 关键字调用了父类的构造函数。
除了继承父类的属性和方法，子类还可以添加自己的属性和方法，例如：
-- -------------------- ---- -------
----- ------ -
------ ----- -------
----------------- ------- -
--------- - -----
-
------ -------------- ------ - -- -
------------------------- ----- ----------- ---------
-
-
----- --- ------- ------ -
------ ------ -------
----------------- ------- ------ ------- -
------------
---------- - ------
-
------ ------ -
------------------ --------
-
-在上面的例子中，Dog 添加了一个新的方法 bark。
implements 的用法
在 TypeScript 中，implements 用于类实现接口，它可以强制实现接口中的所有方法和属性。
接口是一种规范，定义了一组属性和方法，类可以通过实现接口来满足这个规范。接口的语法和类非常相似，只是多了一个 interface 关键字，例如：
interface Person {
name: string;
age: number;
sayHi: () => void;
}在上面的例子中，Person 是一个接口，包含了三个属性：name、age 和 sayHi。注意，接口中的属性和方法都没有实现，只是定义了一种规范。
接口的实现非常简单，只需要在类中实现接口中的所有属性和方法即可：
-- -------------------- ---- -------
--------- ------ -
----- -------
---- -------
------ -- -- -----
-
----- ------- ---------- ------ -
------ ----- -------
------ ---- -------
----------------- ------- ---- ------- -
--------- - -----
-------- - ----
-
------ ------- -
---------------- --- ------------- ----------- ----- ------
-
-在上面的例子中，Student 实现了 Person 接口，实现了接口中的所有属性和方法。
需要注意的是，如果类实现了一个接口，就必须实现该接口中的所有属性和方法，否则编译时会报错。
extends 和 implements 的区别
既然 extends 和 implements 都可以实现属性和方法的继承，那么它们之间到底有什么区别呢？
主要有以下几个方面的区别：
- extends 可以继承类的属性和方法，而 implements 只能实现接口的属性和方法。
- extends 可以实现代码重用和扩展，而 implements 则可以强制实现一定的规范。
举一个例子，假设我们有一个动物园程序，里面有很多动物都有 name 和 move 方法。我们可以把它们抽象成一个 Animal 类，然后所有的动物都继承 Animal 类：
-- -------------------- ---- -------
----- ------ -
------ ----- -------
----------------- ------- -
--------- - -----
-
------ -------------- ------ - -- -
------------------------- ----- ----------- ---------
-
-
----- --- ------- ------ --
----- --- ------- ------ --在上面的例子中，Dog 和 Cat 都继承了 Animal 类的属性和方法，这样代码就可以重用了。
但是，假设我们还要规定每个动物都要实现一个 speak 方法，这个时候就可以使用 implements 了：
-- -------------------- ---- -------
--------- -------- -
------------ -------- -----
-
----- --- ------- ------ ---------- -------- -
------ ------------ ------- -
------------------ -----------
-
-
----- --- ------- ------ ---------- -------- -
------ ------------ ------- -
------------------ -----------
-
-在上面的例子中，我们定义了一个 CanSpeak 接口，规定了一个 speak 方法，然后 Dog 和 Cat 都实现了这个接口，这样我们就可以规定每个动物都要实现一个 speak 方法了。
总结
在 TypeScript 中，extends 和 implements 都是非常重要的关键字，它们分别用于类的继承和接口的实现。
extends 可以实现代码的重用和扩展，而 implements 则可以强制实现一定的规范。
需要注意的是，在使用 implements 的时候，类必须实现接口中的所有属性和方法，否则会编译错误。所以，在实际开发中，应该根据实际场景来选择合适的关键字，避免出现错误和不必要的麻烦。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/648e662c48841e9894cc12c3