当前位置：网站首页 > 技术文章 > 正文

TypeScript 的类

myzbx 2024-12-07 15:14 14 浏览

类（Classes）是对象的模板，用于封装数据和操作数据的方法。JavaScript 类在原型（prototype）的基础上，增加了一些独特的语法。

TypeScript 的类在 JavaScript 类基础上，增加了一些类型（type）定义。

JavaScript 的类是什么样的？

一、JavaScript 的类

定义类时，constructor() 是构造函数，初始化实例时自动执行。

使用 extends 关键词表明继承关系。在子类的构造函数中，可以使用 super() 调用父类的构造函数。

类字段（class fields）罗列属性，更容易看清类的形状。

静态字段（static fields）存储的信息在实例间共享，使用类名（而非实例名）访问。静态字段也是可以被继承的。

使用 get/set 关键词标注 getter/setter 方法，让函数用起来像属性一样。

使用井号前缀（#）标识私有变量。

二、TypeScript 的类型加持

在 JavaScript 类的基础之上，TypeScript 新增许多类型加持。比如，所有字段都可以使用类型标注。

readonly 关键词声明的只读属性，除构造函数外，其他地方不能被修改。

使用 interface 定义接口，implements 让类实现接口。

一个类可以实现多个接口，之间用逗号分隔。

为了控制成员变量和方法的可见性，TypeScript 提供了 public / protected / private 三个修饰符。

所有成员变量和方法默认使用 public 修饰符，即全局可见。private 仅当前类内部可见。protected 仅当前类及其子类内部可见。

JavaScript 和 TypeScript 的私有变量机制有什么不同？JavaScript 的私有变量在运行时也能保证外界无法访问，更加“硬核”。而 TypeScript 的私有变量机制仅存在于源码，只能约束程序员的行为，当转译为 JavaScript 时，这些约束就会丢失。因此，TypeScript 的机制更像一种“君子协定”，不防小人。

和其他类型一样，TypeScript 的类也支持泛型。

使用 abstract 关键词定义抽象类（abstract class）。抽象类中可以包含抽象方法（abstract method）。抽象类不能被实例化，抽象方法只包含函数签名，具体实现留给它的孩儿们。

抽象类一般用作基类，它负责指明方向，具体的脏活累活由子类实现。

参考资料

Classes, https://www.typescriptlang.org/docs/handbook/2/classes.html
Classes, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes

完

HTML 类

上一篇：Javascript定义类(class)的三种方法你喜欢哪种?
下一篇：玩转JavaScript OOP[02]--类的实现

TypeScript 的类

一、JavaScript 的类

二、TypeScript 的类型加持

参考资料

相关推荐

使用VSCode模板提高Vue开发效率（vscode开发vue3）

吃透 Vue 项目开发实践|16个方面深入前端工程化开发技巧【下】

8.7k star，一款超炫酷的动态可视化大屏项目

说下你的vue项目的目录结构，该怎么划分?

这么牛逼的cursor功能，赶紧用起来

用上Vue3，你真的变了吗?（vue3 key）

移动前端重构实战系列:5-7章（前端移动端主要技术有哪些）

20个免费音乐音效下载网站，无版权素材商业影片也可用

什么是“恒定光圈”，什么是“浮动光圈”?-摄影早自习第331

谷歌SEO:外贸电商网站On-page SEO优化实战「附案例」