这是我参与「第四届青训营」笔记创作活动的第8天
本篇笔记主要记录的是关于ts的基础部分。
什么是TypeScript
简介：TypeScript 由微软开发的自由和开源的编程语言。
TypeScript 设计目标是开发大型应用，它可以编译成纯 JavaScript，编译出来的 JavaScript 可以运行在任何浏览器上。
TS与JS的差别
JS：动态类型 弱类型语言
会在执行时做类型检验和匹配
TS：静态类型 弱类型语言
会在执行前检验和匹配
静态类型：
- 可读性增强：基于语法解析TSDoc，ide增强
- 可维护性增强：在编译阶段暴露大部分错误 => 多人合作的大型项目，获得更好的稳定性和开发效率
JS的超集：
- 包容于兼容所有JS特性，支持共存
- 支持渐进式引入与升级
- 现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改
- TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译
弱类型语言特征：类型转化
编辑器推荐
VS code
TS的安装
可使用npm包来安装Ts，如果本地已经安装了npm，可使用以下命令来安装ts。
npm install -g typescript
基本语法
基础数据类型
/*字符串*/
const q = 'string'
/*数字*/
const w = 1;
/*布尔值*/
const e = true;
/*null*/
const r = null;
/*undefined*/
const t = undefined;
ts写法
/*字符串*/
const q: string = 'string'
/*数字*/
const w: number = 1;
/*布尔值*/
const e: boolean = true;
/*null*/
const r: null = null;
/*undefined*/
const t: undefined = undefined;
对象类型
定义对象类型名称时会在名词前加"I"表示该对象是一个类型
eg：const bytedancer:IBytedancer = {}
定义类型使用interface
函数类型
函数也支持使用interface定义类型
函数重载
function getDate(type:'string',timestamp?: string):string
timestamp为可缺省函数，在变量后加一个“？”则为可缺省函数
数组类型
常见用第一、二种
类型+方括号表示：
type IArr1 = number[]
泛型表示：
type IArr2 = Array<string | number | Record<string,number>>
元组表示： type IArr3 = [number,number,string,string]
接口表示：
interface IArr4 {
[key:number]:any }
TS泛型
在不定义类型时类型不明确，用target指代
function getRepeatArr(target){
return new Array(100).fill(target)}
type IGetRepeatArr = (target:any) => any[]
type IGetRepeatArrR = <T>(target: T) => T[]
泛型不止应用在函数中
泛型约束:使用extends
type IGetRepeatStringArr = <T extends string> 限制泛型必须符合字符串
泛型参数默认类型
type IGetRepeatArr<T = number> =(target:T)
默认了数据类型为number类型
这两者是有区别的。
字符串/数字 字面量
允许指定字符串/数字必须的固定值
IDomTag必须为html、body、div、span中的其一
type IDomTag = 'html' | 'body' | 'div' | 'span';
IDomNumber必须为1、3、5、7、9中其一
type IDomNumber = 1|3|5|7|9
高级类型
case、solution、evolution
