TypeScript 入门 | 青训营笔记

63 阅读1分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天

本堂课重点(不熟悉)内容:

TypeScript

推荐Visual Studio Cdoe

弱类型语言

TypeScript基础语法

基础数据类型

  1. 基本属性 image.png
  2. 自建属性 区别好只读属性可选属性任意属性 image.png
  3. 函数类型 image.png
  4. 函数重载 image.png
  5. 数组类型

image.png 6. Typescript补充类型

image.png 7. Typescript泛型 image.png

image.png

  1. 类型别名 & 类型断言

image.png

  1. 字符串/数字 字面量 image.png

高级类型

case、solution、evolution

  1. 联合类型:一个值是几种类型之一
  2. 交叉类型:多种类型叠加到一起 成为一种类型,包含所需所有特性
  3. 类型守卫:当两个类型没有重合点时需要
  4. 函数返回值类型
    • extednds
    • infer

工程应用

webpack

  1. 配置webapack loader相关配置
  2. 配置tsconfig.js文件
  3. 运行webpack启动 /打包
  4. loader处理ts文件时,会进行编译与类型检查
  • 使用TSC编译
    1. 安装Node与npm
    2. 配置tsconfigjs文件
    3. 使用npm安装tsc
    4. 使用tsc运行编译得到js文件

详细知识点介绍:

  1. 动态类型在执行时才做类型匹配,检验 静态类型在编译时进行
  2. TypeScrpipt:
    • 静态类型:(多人合作的大型项目,获得更好的稳定性和开发效率)
      • 可读性增强:基于语法解析TSDoc,ide增强
      • 可维护性增强:编译阶段暴露大部分错误
    • JS的超集:
      • 包含、兼容所有Js特性,支持共存
      • 支持渐进式引入和升级

引用参考:

PPT:

bytedance.feishu.cn/file/boxcnI…