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

01.为什么是TypeScript？

TypeScript发展历史

·2012-10：微软发布了TypeScript第一个版本(0.8)

·2014-10:Angular发布了基于 TypeScript的2.0版本

•2015-04：微软发布了Visual Studio Code

·2016-05：@types/react发布，TypeScript 可开发React

•2020-09:Vue发布了3.0版本，官方支持 TypeScript

2021-11：v4.5版本发布

js和ts的比较∶

js动态类型，弱类型语言

ts静态类型，弱类型语言

动态类型是在执行阶段才能匹配，在执行过程中，js才会与之匹配

静态类型语言，会提前执行，比如，java，python

静态类型

可读性增强：基于语法解析TSDoc，ide增强

可维护性增强：在编译阶段暴露大部分错误

→

多人合作的大型项目中，获得更好的稳定性和开发效率

JS的超集

·包含于兼容所有Js特性，支持共存

支持渐进式引入与升级

编辑器推荐：vs code

02.基本语法

类型分配

创建变量时，TypeScript 有两种分配类型的方式：

显式的 - 明确写出类型。更易于阅读且更有目的性。

隐式的 - 不写出类型，TypeScript 将根据分配的值“猜测”类型（称为 infer 类型推导）。分配更短，输入速度更快，并且经常在开发和测试时使用.

基础数据类型

/* 字符串 */ const q ='string'; /* 数字 */ const w = 1;/ /* 布尔值 */ const e = true; /* null *const r = null; /* undefined */ const t = undefined;

对象类型

const bytedancer:IBytedancer = { jobId: 9303245, name: 'Lin', sex: 'man', age: 28, hobby:'swimming', } interface IBytedancer { /* 只读属性: 约束属性不可在对象初始化外赋值 */ readonly jobId: number;name: string; sex: 'man''woman 'other'; age: number; /* 可选属性: 定义该属性可以不存在 */ hobby?: string; /* 任意属性: 约束所有对象属性都必须是该属性的子类型 */ [key: string]: any; } /* 报错: 无法分配到 "jobId"因为它是只读属性 */ bytedancer.jobId = 12345; /* 成功: 任意属性标注下可以添加任意属性 */ bytedancer.plateform = 'data'; /* 报错: 缺少属性“name"，hobby可缺省 */ const bytedancer2: IBytedancer = { jobId: 89757, sex:'woman', age: 18, }

特殊类型

TypeScript 具有可能不引用任何特定类型数据的特殊类型。

any

any 是一种禁用类型检查并有效地允许使用所有类型的类型。any 类型是一种消除错误的有用方法，因为它禁用了类型检查，但 TypeScript 将无法提供类型安全，并且依赖类型数据的工具（例如自动完成）将无法工作。所以，我们应尽量避免使用它。

unknown

unknown 类型表示任何值，类似于 any 类型，但更安全，因为用未知值做任何事情都是不合法的。由于 any 违背了类型检查的初衷，一般不建议使用，尤其在有了 unknown 类型之后。

never

never 代表从不会出现的值，在函数中它通常表现为抛出异常或无法执行到终止点（例如无限循环）。never 很少单独使用，它的主要用途是在高级泛型中。

void

表示函数没有任何返回语句，或者不从这些返回语句返回任何显式值。在 JavaScript 中，不返回任何值的函数将隐式返回值 undefined。但是，void 和返回 undefined 在 TypeScript 中不是一回事。