TypeScript入门|青训营笔记

56 阅读1分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天,今天学习的内容主要是TypeScript,以下是本次课程的重点内容:

  • TypeScript历史及定义解析
  • TypeScript优势解读
  • TypeScript练习工具
  • 联合交叉类型
  • 类型保护与类型守卫
  • Merge函数类型实现
  • 函数返回值类型
  • TypeScript工程应用

TypeScript历史及定义解析

image.png 所以实际上许多的前端框架都已经支持TS了。

image.png 相比较于JS,TS是静态类型的语言,JS是动态类型的语言,但与此同时他们都是弱类型语言。

TypeScript优势解读

image.png

TypeScript练习工具

推荐使用的是微软的Visual Studio Code。

基础语法

左边是JS,右边是TS。

image.png

image.png

函数重载

image.png

数组类型

image.png TS补充类型

image.png

TS泛型 image.png 类型别名/类型断言 image.png 字符串/数字 字面量

image.png

联合交叉类型

image.png

image.png

image.png

类型保护与类型守卫

image.png

Merge函数类型实现

函数返回值类型

image.png

TypeScript工程应用

image.png

image.png

附:有关TypeScript规范的内容

  1. 学习 JavaScript 基础语法
  2. 学习官网更详细说明
  3. 复习相关特性
  4. 尝试改造项目进行实践