这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天。今天开始学习TypeScript的内容。

为什么什么是TypeScript

TS是静态类型语言、弱类型语言

静态类型：

• 可读性增强：基于语法解析TSDoc，ide增强
• 可维护性增强：在编译阶段暴露大部分错误
• 多人合作的大型项目中，获得更好的稳定性和开发效率

JS的超集

• 包含于兼容所有JS特性，支持共存
• 支持渐进引入与升级

基本语法

基础数据类型

• 字符串
  const q:string='string'
• 数字
  const w:number=1
• 布尔值
  const e:boolean=true
• null
  const r:null=null
• undefined
  const t:undefined=undefined

对象类型

函数类型

写法

interface IMult{
    (x:number,y:number):number;
}
const muit:IMult=(x,y)=>x*y

function add(x:number,y:number):number{
    return x+y;
}
const muit:(x:number,y:number)=>number=(x,y)=>x*y;

函数重载

数组类型

1. 类型+方括号
   type IArr1=number[ ];
2. 泛型类型
   type IArr2 = Array < string | number | Record<string, number>>;
3. 元组表示
   type IArr3=[number,number,string,string];
4. 接口表示\

interface IArr4{
    [key:number]:any;
    }

补充类型

• 空类型 type IEmptyFunction=()=>void;
• 任意类型type IAnyType=any;
• 泛型type INumArr=Array<number>;

高级类型

联合交叉类型

• 联合类型：IA|IB；联合类型标识一个值可以是几种类型之一
• 交叉类型：IA&IB；多种类型叠加到一起成为一种类型，它包含了所需的所有类型的特性

类型保护与类型守卫

类型保护：访问联合类型时，处于程序安全，仅能访问联合类型中的交集部分 类型守卫：定义一个函数，它的返回值是一个类型谓词，生效范围为子作用域

函数返回值类型

工程应用

• Web浏览器
• NodeJS

个人小结

TypeScript在格式上相较于JavaScript比较复杂，但其明确的展现了各变量的类型及便于直接转化为文档还是相当方便的。