学习TypeScrip6---断言类型|联合类型|交叉类型

66 阅读2分钟

联合类型

// 例如我们的手机号通常是数字,但是座机号是字符串
let myPhone: number | string = '010-18322'

//这样写是会报错的应为我们的联合类型只有数字和字符串并没有布尔值
let myPhone: number | string = true

函数使用联合类型

const fn = (something:number | boolean): boolean => {
    return !!something
}

交叉类型

多种类型的集合,联合对象将具有所联合类型的所有成员

interface People {
    age: number,
    name: string
}

interface Man {
    sex: number
}

const obj = (man: People & Man): void => {
    console.log(man)
}

obj({
    age: 17,
    name: 'xxx',
    sex: 2
})

类型断言

语法:值 as 类型  或  <类型>值  
value as string  <string>value

interface A {
    run: string
}

interface B {
    build: string
}

const fn = (type: A | B): string => {
    return type.run
}
//这样写是有警告的应为B的接口上面是没有定义run这个属性的

//可以使用类型断言来推断他传入的是A接口的值
const fn = (type: A | B): string => {
    return (type as A).run
}

需要注意的是,类型断言只能够「欺骗」TypeScript 编译器,无法避免运行时的错误,反而滥用类型断言可能会导致运行时错误:

使用any临时断言

window.abc = 123
//这样写会报错因为window没有abc这个东西

(window as any).abc = 123
// 可以使用any临时断言在any 类型的变量上,访问任何属性都是允许的。

as vs const

是对字面值的断言,与const直接定义常量是有区别的

如果是普通类型跟直接const 声明是一样的

const names = '谢谢谢谢'
names = 'aaa'  // 无法修改

let names2 = '谢谢谢谢' as const 
names2 = 'aaa' // 无法修改

// 数组
let a1 = [10, 20] as const
const a2 = [10, 20]

a1.unshift(30); // 错误,此时已经断言字面量为[10,20],数据无法做任何修改
a2.unshift(30); // 通过,没有修改指针

类型断言是不具有影响力的

在下面的例子中,将 something 断言为boolean,虽然可以通过编译,但是并没有什么用,并不会影响结果, 因为编译过程中会删除类型断言

function toBoolean(something: any): boolean {
    return something as boolean;
}

toBoolean(1);
// 返回值依然是1