TypeScript

TypeScript通过TypeScript编译器或Babel转译为JavaScript代码，可运行在任何浏览器，任何操作系统。

ts的基本类型

string number boolean

使用 ：

let a:string='kang'
let b:number=1
let c:boolean=true

使用字面量来标注类型

let a: 11 | 12   //联合类型，此时的a只能是11或者12
a = 12

any 任意类型,any或者没有声明类型的变量都是任意类型

let name
let d: any;
d = 1
d = 'str'
d = false

unknown 表示未知类型，实际上就是类型安全的any,她不能直接复制给别的变量

let k: unknown;
k = 1
k = 'lll'

ang和unkown区别

let s: string = d   //不报错，any类型可以将自己赋值给别的类型，
// let f:string =k   //报错，不能将unknown类型的变量赋值给string类型，想要让它赋值要先做判断或类型断言
if (typeof k === 'string') {
    s = k
}
// 使用类型断言，可以告诉解析器变量的实际类型,两种语法
s = k as string
s = <string>k

void 表示空(undefined)， 用来设置函数的返回值，表示函数没有返回值

function fn(): void {
}

never 表示没有值，不永远不会返回结果

function fn2(): never {
    throw new Error('err')
}

其他类型

object 对象

以下两种方式都可以来定义对象类型的变量

let obj = {}
console.log(typeof obj);   //object
let obj2: object = { l: 'l' }
console.log(typeof obj2);  //object

• 限制对象的结构

// 通常用{}来指定对象里面可以包含哪些属性,复制的对象和指定的对象的结构必须要一样，都则会报错
let obj3: { name: string, age: number }
obj3 = { name: 'kang', age: 18 }
// obj3={name:'yi'}  //报错：类型 "{ name: string; }" 中缺少属性 "age"

// 给属性后面加?表示这个属性是可选的，可有可无
let obj4: { name: string, age?: number }
obj4 = { name: 'kangyi' }

// 表示在obj5里面必须有name属性，其他属性可有可无，其他属性的格式是属性名是字符串，属性是是任意的
let obj5: { name: string, [propName: string]: any }
obj5 = { name: 'kyky', age: 18, gender: 'famale' }
obj5 = { name: 'kyky' }
// obj5={age:18,gender:'famale'}   //报错，类型 "{ age: number; sex: string; }" 中缺少属性 "name"

• 限制函数的结构

let fn3: (a: number, b: number) => number
fn3 = function (a: number, b: number): number {
    return a + b
}

array数组，两种表达方式

let arr1: number[]  //数组里只能存放数字
arr1 = [1, 2, 3, 4]
// arr1=[1,2,3,'k']    //不能将类型“string”分配给类型“number”

let arr2: Array<string>
arr2 = ['a', 'b', 'c', 'sss']
// arr2=[1,'a']     //不能将类型“number”分配给类型“string”

tuple 元组，有固定长度的数组

let t1: [number, number, number]
t1 = [1, 2, 3]

enum 枚举

enum Gender {
    male,
    famale
}
let person: { name: string, gender: Gender }
person = { name: "kang", gender: Gender.famale }

给类型起别名,可以简化类型的使用

type myType = 1 | 2 | 3 | 4 | 5
let m: myType
let n: myType

遇到的bug

刚开始的时候报错：let a: number = 1; 无法重新声明块范围变量“a”。
之所以 tslint 会提示这个错误，是因为在 Commonjs 规范里，没有像 ESModule 能形成闭包的「模块」概念，所有的模块在引用时都默认被抛至全局，因此当再次声明某个模块时，TypeScript 会认为重复声明了两次相同的变量进而抛错。

• 在ts最后加上export{} 使用插件@babel/plugin-transform-modules-commonjs