1.TypeScript的好处
TypeScript解决了JavaScript的一大痛点,那就是动态类型
3.如何开始使用
3.1安装环境
npm install -g typescript
//编译命令
tsc hello.ts
3.2 类型写法
TypeScript在创建一个变量时必须声明它的类型,有多人会担心这会限制自己的骚操作,不用担心,你想骚也可以全都用any。
//布尔值
let isDone: boolean = false
//数字
let n: number = 6
//字符串
let pepoName: string = '小王'
let introduction: string = `${pepoName}今年已经${n}岁了!!!`
//任意类型
let anySomething: any = '什么都行'
//联合类型,两种类型都可以
let numandstring: number | string;
//数组
let list: number[] = [1,2,3]
let listString: string[] = ['1','2','3']
let numandString: (number | string)[] = ['1',2,3]
TypeScript还有类型推论,如果在创建一个变量的时候没有指定类型,那么会根据赋值类型来决定,如果只是创建了一个变量但是没有赋值,会默认为any
3.3接口
接口是TypeScript的特性,可以创建一个类,然后通过调用这个类来生成实例:
interface Person {
//只读属性,只能在创建实例的时候赋值,之后不可以更改
readonly id: number;
name: string;
age: number;
//后面加问号的话允许创建实例时少这个属性
address?: string;
//如果希望在实例里自由添加属性,可以使用任意属性
//但是要注意的是,一旦创建了任意属性,那么接口里面的确定属性和必要属性必须为任意属性类型的子集
//比如任意属性的类型为string的话,age会报错,因为它为number
[propName: string]: any;
}
//多一个属性或者少一个都会报错
let tom: Person = {
id: 1,
name: 'Tom',
age: 18,
}
3.4 函数
//空白值函数
function awsome(): void{
console.log('do something')
}
//参数后面有?则是可以跳过
function buildName(firstName: string, lastName?: string, age: number = 18){
if(!lastName){
console.log(firstName)
return
}
console.log(firstName + lastName)
}
3.5 声明文件
在使用第三方库时,必须引入它的声明文件才能获得代码补全和提示,可以使用@types来管理声明文件,比如要使用Puppeteer,要引入它的声明文件需要:
npm install @types/Puppeteer