Typescript复习
之前也速成过一个教程,但是很多地方没有搞明白,然后去看了一个网上别人推荐的课来复习,发现很清晰很细致,今天只是学了一小部分,还有一个装饰器后面再补。
数据类型
(1) any:
可以是任何的类型,相当于直接回到js了, 并且注意any可以复制给任何类型,且还是可以访问任何不存在的东西。
(2) unknown:
unknown可以理解为一个类型安全的any,适用于不确定数据的具体类型,会强制让使用者执行类型判断,访问什么属性和方法都报错。
let a: unknown
a = "hello"
(a as string).toUppercase()
- 类型收缩:
- if(typeof xxx === 'string') {//进行赋值或者其它的操作}
- 类型断言:a = b as string || x = y
(4) never:
never是什么值都不是,是用来限制函数的返回值的。
- 函数有问题,抛出异常
- 永远没结果,不能正常结束
(5) void
- 通常用于函数返回值声明,函数返回值为空,其实就是返回undefined
- void 希望开发者不要关心返回值,不要去拿返回值去操作,操作返回值的时候ts会检测。
- void和undefined的区别:
(1) void是一种空的广泛概念,而undefined是一种具体的空
(2) undefined是void可以接受的一种形式
(3) void是一种意图上的约定
(6) object
- 开发中用的比较少,存的是非原始类型
- Object: 可以调用Object的方法的值,更宽泛,除了undefined和null
(7) 声明对象类型:
- {key:type}
- 如果是可选的属性的话:{key?:type}
ts
let a: {name: string, age: number}
a = {name: "cjy", age: 18, handsome: true}
- 索引签名:可以增加其它的属性
ts
let person: {
name: string,
age: number,
[key:string]:any // 索引签名
}
person = {
name: "cjy",
age: 18,
handsome: true
}
(8) 声明函数类型:
ts
let f: (a: number, b: number) => number // 函数类型声明
f = (a, b) => {
return a + b
}
(9) 声明数组类型:
ts
let arr1: string[]
let arr2: Array<number>
(10) tuple: 元祖类型
ts
let t1: [string, number]
t1 = ['cjy', 18]
let t2: [number, boolean?]
t2 = [18]
t2 = [18, true]
let t3: [number, ...string[]]
t3 = [123, "12", "3, 4"]
(11) enum: 枚举类型,一组命名常量,可以增加代码的可读性。
ts
enum Direction {
Up,
Down,
Left,
Right
}
- 数字枚举:会按顺序进行数字映射,并且反向映射。
ts
enum Direction {
Up = 0,
Down,
Left,
Right
}
- 字符串枚举:丢失了反向映射
ts
enum Direction {
Up = "up",
Down = "down",
Left = "left",
Right = "right"
}
- 常量枚举:ts会进行删减代码,将用不到的代码去掉,ts也会自己读取值。
ts
const enum Direction {
Up,
Down,
Left,
Right
}
(12) type
- 引入了一个联合类型的概念,相当于或。
ts
type S1 = number | string
type S2 = '1' | '2'
- 交叉类型:
ts
type S1 = {
h: number,
w: number
}
type S2 = {
room: number
}
type House = S1 & S2
const house: House = {
h: 1,
w: 2,
room: 3
}
(13) interface接口
interface是一种定义结构的方式,主要作用为:类、对象、函数的一种契约,这样可以确保代码的一致性和类型安全,注意interface是一种类型形式,不能有具体实现。
ts
interface IPersion {
name: string,
age: number,
speak: (n: number) => void
}
// 类
class Person implements IPersion {
constructor(public name: string, public age: number) {
}
speak(n: number) {
console.log(n)
}
}
interface IUser {
name: string,
readonly gender: string,
age ?: number,
run: (n: number) => void
}
// 对象
const user: IUser = {
name: "cjy",
gender: "male",
run: (n) => {
console.log(n)
}
}
(14) 泛型
- 泛型函数:
ts
function log<T>(data: T): T {
console.log(data);
return data
}
log(111)
log("dasd")
log<number>(111)
log<string>("dasd")
- 泛型可以有多个:
ts
function log<T, U>(data1: T, data2: U): T | U {
return Math.floor(Math.random()*10) % 2 ? data1 : data2
}
log<string, number>("2123", 3)
- 接口中限制类型:
ts
type fn = (a: number, b: number) => void
interface Iperson<T, U> {
name: string,
age: number,
handsome?: boolean,
des: T,
fn: U
}
const x: Iperson<string, fn> = {
name: "cjy",
age: 18,
des: "handsome",
fn: (a, b) => {
console.log(a + b)
}
}
- 类中的泛型限制:
ts
class Person<T> {
constructor(
public name: string,
public age: number,
public handsome: T
) {
}
speak() {
console.log(111);
}
}
const x = new Person<boolean>("cjy", 18, true)
(15) 类型声明文件:
引入js文件时,需要用xxx.d.ts声明好类型,然后在ts引入。
看到一个编程技巧,看到视频里面的强制折叠:
#region
....
#endregion
该区域将强制折叠