Typescript学习3 ( 联合类型 | 交叉类型 | 类型断言 )

目录

Typescript学习

1.联合类型

普通类型

函数类型

2.交叉类型

3.类型断言

3.any临时断言

4.类型断言不影响运行结果，编译过程会删除类型断言

---

1.联合类型

普通类型

let phone: number | string = '020-333' //数字类型和字符串类型都可以，相当于并列的关系

函数类型

let fn = (num: number | boolean): boolean => { //函数的参数值指定两种并列的类型
    return !num //强制转换
} 
console.log(fn(1), fn(false)); //结果为false,true

2.交叉类型

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

interface people {
    name: string,
    age: number
}
interface hobby {
    toy: string
}
const xxx = (man: people & hobby): void => { //将两者合并在一起
    console.log(man);
}
xxx({
    name: '小胖',
    age: 18,
    toy: 'car'
}) //结果为{name:'小胖',age:18,toy:'car'}

3.类型断言

1.第一种、值 as 类型

let fn = (num: number | string): void => {
    console.log((num as string).length); //（值 as 类型)
}
fn('12345') // 结果为5

2.第二种、<类型>值

interface A {
    width: number
}
interface B {
    name: string
}
let fn = (num: A | B): void => {
    console.log((<A>num).width); //<类型>值
}
fn({width: 20}) //结果为20
fn({name: '小胖'}) //结果为undefined
//类型断言只能够欺骗TypeScript 编译器，无法避免运行时的错误，反而滥用类型断言可能会导致运行时错误

3.any临时断言

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

4.类型断言不影响运行结果，编译过程会删除类型断言

let fn = (num: any): boolean => {
    return num as boolean
}
console.log(fn(1)); //结果为1