这是我参与「第五届青训营 」伴学笔记创作活动的第 2 天
作为一个知识树比较奇葩的小白,一直在用ts写前后端,但一直对它一知半解……在青训营里,我再次遇见它,这次要好好了解一下它!
关于TypeScript
2012年微软发布了第一个版本的ts,随后angular、react、vue等相继发布了对应的ts版。js作为一个动态类型的弱类型语言,有着相当大的灵活性,某种程度上也是js如此流行的一大原因。
然而随着web应用不断增加地功能、代码量,js逐渐被发现其难以大规模维护,ts的出现正是为了解决这一难题。ts作为js的超集,能够直接运行js代码,并且引入了强制类型,成为一个静态类型的语言,使得在编译阶段就能及时发现很多隐藏的问题。这将极大地提高开发效率与团队协作的稳定。
基本语法
在我使用体验来说,和js差不多。更详细的内容官网讲了很多而且很详细www.typescriptlang.org/docs/
对于一般情况,ts相当于给js变量指定了一种数据类型:
// js
const x = 1;
// ts
const x: number = 1;
一些比较有意思的有泛型的概念,它不会提前规定数据类型,而是使用时进行指定。
type Ttype = (args: any) => any[];
type IType = <T>(args: T) => T[];
使用extends和as进行类型别名和断言
T extends IType
resault as IType
还有一些奇奇怪怪的类型定义方式
type AType = '1' | '2' | '3' | '4'
type BType = 1 | '2' | 3 | '4'
高级数据类型
联合类型:表示一个值可以是几种类型之一。
交叉类型:多种类型叠加到一起成为一种类型,包含了所需的所有类型的特性。
偷个懒简单写一下……
// 联合
IA | IB
// 交叉
IA & IB
访问联合类型时,只能访问公共部分,处于“程序安全”。若需要访问类型独特的部分,需要单独判断。
使用关键字keyof能够得到对象类型的key组成的字面量。
关键字extends跟随泛型出现时表示类型推断,表达式类似三元运算
关键字infer将推荐几个类型
工程应用
使用webpack?涉及内容并不多,但提到了使用tsc对.ts文件编译。这个过程更像是翻译,将ts自己加出来的那部分内容使用后删去,根据ts逻辑生成一系列js文件。