这是我参与「第四届青训营 」笔记创作活动的第15天

高级类型

联合/交叉类型

• 联合类型: IA | IB;联合类型表示一个值可以是几种类型之一
• 交叉类型: IA & IB;多种类型叠加到一起成为一种类型，它包含了所需的所有类型的特性

const bookList =[{
author:'xiaoming',
type:'history',
range: '2001-2021',
},{
author:'xiaoli',
type:'story',
theme:'love',
}]

类型保护与类型守卫

类型保护是可执行运行时检查的一种表达式，用于确保该类型在一定的范围内。

//实现函数reverse
//其可将数组或字符串进行反转
function reverse(target: string | Array<any>) {
    /* typof类型保护*/
    if (typeof target === 'string') {
    return target.split(''). reverse().join('');
    }
    /*instance类型保护*/
    if (target instanceof Object) {
    return target.reverse();
    }
}

当两个类型完全没有任何重合点的时候，才需要写类型守卫

interface IA { a: 1, a1: 2 }
interface IB { b: 1, b1: 2 }
/*类型守卫:定义一个函数，它的返回值是一个类型谓词，生效范围为子作用域*/
function getIsIA( arg: IA| IB) :arg is IA{
    return!!(arg as IA).a;
}
function log2( arg:IA|IB){
    if ( getIsIA( arg) ) {
    console. log( arg. a1 )
    }
    else{
    console. log( arg. b1) ;
    }
}

高级类型

interface IMerge{
<T extends Record<string, any>>( sourceObj: Partial<T>, targetObj: T): T;
}
type IPartial< T extends Record<string, any>> = {
[ P in keyof T]?: T[ P];
}

• 索引类型：关键字[keyof]，其相当于取值对象中的所有key组成的字符串字面量，如

type IKeys = keyof { a: string ; b: number }; => typeIKeys = "a" | "b"

• 关键字[in]，其相当于取值字符串字面量中的一种可能，配合泛型P，即表示每个key
• 关键字[?]，通过设定对象可选选项，即可自动推导出子集类型

函数返回值类型

type IDelayCall = <T extends ( ) => any>( func: T) => ReturnType<T>;
type IReturnType<T extends (...args: any) => any > = T extends (...args: any )
=>infer R ? R : any

关键字[extends]跟随泛型出现时，表示类型推断，其表达可类比三元表达式

如T===判断类型?类型A:类型B

关键字[infer] 出现在类型推荐中，表示定义类型变量，可以用于指代类型

如该场景下，将函数的返回值类型作为变量，使用新泛型R表示，使用在类型推荐命中的结果中

工程应用

浏览器Web

1. 配置webapack loader相关配置
2. 配置tsconfig.js文件
3. 运行webpack启动/打包
4. loader处理ts文件时，会进行编译与类型检查

NodeJs

使用TSC编译

1. 安装Node与npm
2. 配置tsconfig.js文件
3. 使用npm安装tsc
4. 使用tsc运行编译得到js文件