TypeScript ：Microsoft的一种开源，强类型，面向对象的编译语言

在这篇文章中，将用简单明了的术语来介绍TypeScript中mixins的概念，所以即使你对这个概念很生，你也可以跟着学，并且有足够的动力将这个工具采用到你的工作流程中。

 

 

 

 

TypeScript

TypeScript是Microsoft开发和维护的一种开源，强类型，面向对象的编译语言。它是数百万个项目（在GitHub上超过200万个）使用的非常流行的JavaScript的超集，该项目旨在将静态类型引入现代JavaScript。 TypeScript编译器读取TypeScript代码，该代码具有类型声明和类型批注之类的内容，并发出经过转换和删除的那些结构的清晰可读的JavaScript。

 

您将学到什么

本文介绍了TypeScript中混合宏的概念和用法以及它们为什么很重要。它将涵盖语法，类型和参数的构建方式，并附带清晰定义的示例，您可以在所选的集成开发环境中进行后续操作。

 

前提条件

为了正确地进行操作并从本文中学习，您将需要在计算机上准备以下内容：

 

安装Node：可以通过以下命令检查是否已经安装了Node：

节点-v

安装Node软件包管理器：Node通常带有必需版本的npm。

TypeScript的安装：如果安装了Node软件包管理器，则可以使用它通过以下命令在计算机上全局安装TypeScript：

npm install -g TypeScript

集成开发环境（IDE）：在本文中，您将使用Microsoft团队提供的Visual StudioCode。您可以在这里下载。转至下载文件的位置，并按照提示进行安装，并记住单击“使用代码添加打开”选项，以便您可以轻松地从计算机中的任何文件夹访问VS Code。

在您选择的位置创建一个新文件夹，然后在您的IDE中打开它。

在此新文件夹中创建一个名为test.ts的文件，您将在使用过程中亲自测试本教程中的所有示例。

本文是为具有各种知识水平的TypeScript开发人员编写的，其中包括但不完全针对初学者。但是，添加了设置工作环境的步骤，以使TypeScript和Visual Studio Code应用程序的新开发人员受益。

 

在TypeScript中扩展类

就像许多面向对象的编程语言一样，TypeScript也具有类。类是用于创建对象的蓝图-它们基本上用于封装在对象中找到的数据。可以像下面这样定义TypeScript类：

 

 

 

 

此类包含一个称为提醒的函数，该函数将一个字符串记录在DOM的控制台中。如果您有新分类，请：

 

 

而且，如果您想拥有一个扩展了我们已经定义的两个类的类，以便可以在新类中访问它们，TypeScript不允许这样做，因此将其标记为错误。您可以这样尝试：

 

 

 

问题

如果你试过这样做，你会看到吱吱作响的线条，当你把目光停留在IDE上时，会告诉你TypeScript类只能扩展一个类。这个问题，当你在第一时间遇到的时候，你可能会想起接口。

 

接口

在TypeScript中，类只能扩展一个类，但一个接口可以扩展多个类。使用TypeScript接口来解决我们的问题。

 

 

 

我们创建一个接口，然后尝试查看是否可以访问我们已经定义的两个类中的函数。如果您在终端中运行build：

 

 

 

您将在构建的终端中看到一个错误，提示提醒和结尾均不起作用。这是因为TypeScript接口即使可以扩展类，也没有类的实现。这使我们回到最初的问题，即在TypeScript的新类中不能访问多个类。

 

解决方案: Mixins

Mixins是一种在面向对象的编程范例中实现重用组件的方法。因此，对于我们的问题空间，我们可以仅使用带有一个辅助函数的mixins来指定所需的行为，即在TypeScript的新类中扩展两个类。因此，如果您是前端开发人员并使用SASS，则您可能熟悉mixins。这是相同的概念，但用于扩展类。可以在TypeScript的官方文档中找到帮助程序功能。

 

 

现在，您可以使用ApplyMixins函数描述您想要的内容，因此对于我们的ts文件，它们将全部组合在一起，如下所示：

 

引入辅助函数后，它会通过遍历每个mixins的属性并将其复制到mixins的目标，并通过其实现填充替代属性来为我们进行混合。现在，ApplyMixins函数可以帮助您指定要查看的确切接口并执行扩展。

 

如果您再次重新运行构建代码，则应该看到终端现在已经成功地从订阅类中的提醒功能中打印了“记住要订阅我的频道”，并在YouTube的结束功能中成功打印了“谢谢您观看我的视频” 课，就像我们想要的。

 

总结

这是有关TypeScript中的mixin的介绍性文章，它们如何帮助实现扩展类以及如何在工作流中使用它们。