Ts-入门
# Ts-入门
- string
- number
- boolean
- null
- undefined
# 1.1 默认分配
let str = 'str'
会被默认定义为string类型
# 1.2 类型注解
let num: number=10
其中: number
是类型注解
# 1.3 类型断言
let numArr =[1,2,3];
const result =numArr.find(item=> item >2)
result *5
2
3
上述代码会报错
因为result的类型是undefined
当我们确定数组中有大于2的值时,我们可以使用断言
(最好别在明知有可能不是number的情况下使用)
let numArr =[1,2,3];
const result =numArr.find(item=> item >2) as number
result *5
2
3
也就是在result的表达式后面加上 as number
表示一个断言
# 1.4 联合类型
如果我认为一个变量是string或null类型则可以这样写
let v4: string | null =null
需要注意的是,如果关闭配置中的strictNullChecks
则可以不需要先联合null类型,随意分配null
也可以直接联合常量,例如我希望一个数只等于 1,2,3其中之一,可以这样写
let v5: 1 | 2 | 3 = 2
# 2、数组、元组、枚举
# 2.1 数组
定义一个number类型的数组
let arr: number[] = [1,2,3]
let arr1: Array<number> = [1,2,3]
如果你想往这样一个数组里添加一个字符串,会出现编译错误
# 2.2 元组
具体定义数组里每一个元素的类型
let t1: [number,string,number] = [1,'a',2]
可以设置可选元素,可选元素只能放在尾部,在定义类型后加上?
,设置后指定位置的元素不一定要设置值
let t1: [number,string,number?] = [1,'a']
# 2.3 枚举
enum MyEnum {
A,
B,
C
}
console.log(MyEnum.A)
console.log(MyEnum[0])
2
3
4
5
6
7
# 3、函数
function myFn(a: number,b?:number): void{
console.log(a);
console.log(b);
}
2
3
4
上述代码是一个两个number类型形参,其中第二个参数是可选参数,可选参数要放在最右侧
function myFn(a: number,b?:number , ...rest: number[]): void{
console.log(a);
console.log(b);
console.log(rest);
}
2
3
4
5
上述是第三个参数是剩余参数,剩余参数语法允许我们将一个不定数量的参数表示为一个数组。
# 4、接口
对象的模板
interface Obj {
name: string,
age: number
}
const obj: Obj ={
name: 'a',
age: 10
}
2
3
4
5
6
7
8
优势是可以做字段检查(例如字段写成了ago
)和类型检查
# 5、类型
假设一个变量的类型是string | null
那么你可以封装这个类型
let UserName = string | null
let v1: UserName = null;
2
# 6、泛型
function myFn(a: number,b: number): number[]{
return [a,b];
}
2
3
这是一个简单的函数,如果我想传入boolean类型或string类型则可以使用泛型
function myFn<T>(a: T,b: T): T[]{
return [a,b];
}
myFn<number>(1,2)
myFn('a','b') // 因为ts支持类型推断,所以不一定需要指定类型
2
3
4
5
该例为泛型使用实例