深入浅出理解TypeScript | 青训营

53 阅读3分钟

学习目的:

       学习活跃度上升,使用范围扩大;

       现代工程中应用广泛;

对比TS与JS:

       TS是JS的超集,用于解决大型项目的代码复杂性;

       JS是一种编程语言,用于创建动态网页;

       TS是一种强类型,支持静态和动态类型;

       JS是一种动态弱类型语言;

       TS可以在编译期间发现并纠正错误;

JS只有在运行时发现错误;

TS不允许改变变量的数据类型;

JS数据变量可以被赋予任何不同的类型;

TS的好处:类型安全,完善的数据工具;

TS基础:

       类型基础:

              Boolean、number、string;

              枚举enum;

              Any、unkown、void;

              Never;

              数组类型[];

              元组类型tuple;

       函数类型:

              定义:TS定义函数类型时要定义输入参数类型和输出类型;

              输入参数:支持可选参数和默认参数;

              输出参数:输出可以自动推断,没有返回值时,默认返回VIOD类型;

              函数重载:名称相同但参数不同,可以通过重载支持多种类型;

       Interface(接口):

              定义:接口是为了定义对象类型;

              特点:

                     可选属性:?;

                     只读属性:readonly;

                     可以描述自定义属性;

                     可以描述函数类型;

              接口非常灵活duck typing;

       class类:

              定义:写法与JS差不多,增加了一些定义;

              特点:

                     增加了public、private、protected修饰符;

                     抽象类:

                            只能被继承,不能被实例化;

                            作为基类,抽象方法必须被子类实现;

                     Interface约束类,使用implemengts关键字;

TS进阶:

       高级类型:

              联合类型 |;

              交叉类型 &;

              类型断言 as;

              类型别名:(type VS interface)

                     定义:给类型起个别名;

                     相同点:

1.      都可以进行定义对象或函数;

2.      都允许继承;

差异点:

1.      interface是TS用来定义对象,type是用来定义别名方便使用;

2.      type可以定义基础类型,interface不行;

3.      interface可以合并重复声明,type不行;

泛型-什么时候需要泛型:

       定义:软件工程中,我们不仅需要创建一直定义良好的API,同时也需要考虑重用性;

       组件不仅能支持当前的数据类型,同时也能支持未来的数据类型;

       为创建大型系统时提供了十分灵活的功能;

在C和Java这样的语言中,可以使用泛型来创建可重用的组件;

一个组件可以支持多种类型的数据,用户可以根据自己的数据类型使用组件;

泛型工具类型

       基础操作符:

              Typeof: 获取类型;

              Keyof:获取所有键;

              In:遍历枚举类型;

              T[K]:索引访问;

              Extends:泛型约束;

       常用工具类型:

              Partial:将类型属性变为可选;

              Required:将类型属性变为必选;

              Readonly:将类型属性变为只读;

              Pick、record...

TS实战:

       声明文件:

              Declare:三方库需要声明的文件;

              .d.ts:声明文件定义;

              @types:三方库TS类型包;

              Tsconig.json:定义TS的配置;

       泛型约束后端接口类型:

              对应相关入参,确认接口具体访问;

              发生错误时,定位错误代码