深入浅出 TypeScript| 青训营笔记

79 阅读2分钟

课程重点

  • 整体介绍:Ts 背景、优缺点、社区活跃度等

  • TS常用类型基本概念

    • 基础类型、对象类型、接口、断言等
  • 进阶用法

    • 类、泛型及使用场景
  • 工程向

    • 代码检测、编译配置、tsconfig介绍
    • 工程中最佳实践、迁移工具

课程内容

先了解一下TS和JS的差异: image.png 那TS到底带来了些什么?
首先,它作为一门语言,它首先带来的是类型安全,和C++一样;然后,它还包含了一些编译器,它会支持一些JS的一些像ES新版本里才会支持的一些特性功能;再然后就是它比较核心部分,因为TS的类型就是我们可以从idea上就容易去理解代码,我们可以围绕这些编码属性去整理一些相关的工具,来提高我们一些这个开发效率。所以,总的来说,TS不仅仅是一门语言,更是生产力工具。
以下是一些TS的相关学习链接推荐:
Awesome TypescriptTS开源教程及应用
Typescript Playground TS到JS在线编程

TS基础

基础类型

首先它也是涉及到三个比较重要的类型,就是:boolean ,number, string
这里的number它其实包含整数,负数和浮点数,既保持了TS原有的灵活性,又能在类型上去对JS做一定的扩展

image.png

never类型它更多的是分场景去使用eg: image.png
如上图,我在这个test里面,去接受string number这两类类型的话,会去走到never这个throwError的这个类型里面来去标识,这是一个错误的返回状态

数组类型,它可以根据一些技术类型或者说我们的对象类型来增加一个数组标识,进行数组定义

元组类型,它是数组类型的一个特殊的形式,然后它需要显示的去标注每一个数字中每一个元素的一个类型

函数类型

定义:TS定义函数类型时要定义输入参数类型和输出类型
输入参数:参数支持可选参数和默认参数
输出参数:输出可以自动推断,没有返回值时,默认为void类型
函数重载:名称相同但参数不同,可以通过重载支持多种类型 image.png

接口interface

接口是为了定义对象类型
特点:
image.png
总的来说,接口非常灵活。

JS进阶

高级类型

image.png

image.png

image.png