TypeScript接口，枚举，类的总结

发布时间：2025-09-21 00:56:14 阅读量： 7 来源： 互联网转载

如果认真讲解起来，接口，枚举，类其实都可以啰嗦很久。如果我们只是需要入门的话把一些很简单的东西讲的很细。虽然这绝对不会有错。但实际上如果没有实际工作的经验肯定是边学边忘。我学习的方法就是先不说把一些东西学的精通。只需要大概了解一下能实际应用就行，然后再实际应用中自然会慢慢了解到学习对象的更深入的方法

什么是接口

如果我们看了上一篇文章，接口其实跟Type(类型别名)差不多，只有一些很细微的不同，都可以用来约束数据类型。下面请看代码

Type和interface除了语法不同外，大致还是一样的。所以如果熟悉了Type那么interface本质没啥区别。我总结了一下不同点扩展语法(继承)，Type 使用&,,interface使用extends。同名合并type 不支持,interface 支持.计算属性，type 支持计算属性，生成映射类型,；interface 不支持。描述类型，对象、函数两者都适用，但是 type 可以用于基础类型、联合类型、元祖。

TypeScript 的枚举

枚举其实就是一种数组的字典，它可以给数组进行编号。枚举目前我用的比较少。反正大概也知道怎么用，请看下面的代码

TempEnum.a打印后的值是0，这样看来，枚举可以当作常量使用。或则让一些不太容易理解的数据对它们做一个枚举同时取一个容易理解的名字还不错的。当然枚举还有很多的属性方法，如果我们有兴趣的话可以自行查看一下相关的资料

Class类的实例

好了，废话不多说先上图

上述代码中，x,y是类TempClass的属性方法，用来输入输出数据所用。其中y的前缀readonly代表它是一个只读的数据，只可以读不能写，如果一定要写的话也只能再构造函数当中写了。

构造函数Constructor()

构造函数我认为它是一种特殊的函数，它的作用就是再类初始化的时候进行操作的函数。比如，我们设置constructor(n:number),那么我们在new类的时候就需要Let b:TempClass=new TempClass(3)。在constructor里的参数可以理解为平常我们使用的函数里的参数。图片里constructor重写了x和y的值，那么在我们new了这个类以后，x和y的值就为constructor里定义的了。

接下来是2个函数，其实没啥好讲的。就是加了:void的函数代表的是这个函数不能有返回值。具体什么时候使用就看具体情况了。

上面就是class类的基本使用方法，当然类的方法还挺多的。比如属性的Getters/Setter，索引签名，继承等。下图是vue里使用的类的一个实例

最后的一点总结

class（类）是一系列方法和属性的***，它可以做为一种数据模型，也可以做为一系列方法的***体用途还是比较广泛的。如果我们学习过面向对象的语言就知道，程序一切都是可以面向对象的。所以如果我们只使用TS的class本质也是可以开发出一个完整的项目的，只需要定义一个起始的类，通过这个类调用其他类就可以完成一个完整项目的所有功能。包括VUE其实很多思想也是借鉴了面向对象的方法。认真研究VUE会发现其实它真的跟面向对象再某些方法面是很想象的。

TypeScript自学心得分享 TypeScript与JavaScript对数据处理的对比自学TypeScript泛型的心得 TypeScript接口，枚举，类的总结 TypeScript实战项目中使用心得

上一篇: 从数据分析中寻找网站转换率提高的机会

下一篇: 国美苏宁当当剑指京东低价竞跑折射电商困境

TypeScript接口，枚举，类的总结

热门文章