ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

typescript(ts) 类型演算,类型推导

2021-02-03 20:00:23  阅读:450  来源: 互联网

标签:typescript const ts 关键字 keyof typeof 类型 type


导言:我们都知道,ts 具有类型推导,并且可以很好的进行智能的类型推导。但是如果我们想要手动的来进行类型推导 —— 通过已知的类型来推断另一个类型,那么这个需要怎么做呢?

关键字

主要的关键字有以下几个: typeof,in, keyof 等关键字

typeof关键字

大家看到typeof, 肯定会说 js 中已经存在了哇,但是ts 中的typeof 有不一样的用法:
在这里插入图片描述
这里ts 在 类型检查的时候报错,typeof 用在类型检查的位置。所以,在这里typeof的作用是:获取某个数据的类型, 上面的c 的类型是b的变量,这个b又是const定义的(const 和 let 定义的区别在于 const 定义常量, let 定义变量,详细)常量的值一般在声明的时候就要赋值,所以b 的类型不是string, 而是一个字面量:
在这里插入图片描述
如何把上面代码修改的不报错呢?

解决方法:

  • 方法一: 把const 修改成 let
    在这里插入图片描述
    -方法二: 手动给const 声明类型:
    在这里插入图片描述

由上面的这个小例子,我们可以得出:TS中的typeof,书写的位置在类型约束的位置上。表示:获取某个数据的类型 但是typeof 作用于类的时候,确实一个类的构造函数
在这里插入图片描述
在这里插入图片描述

keyof 关键字

作用于接口类型别名,用于获取其他类型中的所有成员名组成的联合类型
在这里插入图片描述

获取多个级联类型的交集

在这里插入图片描述

如果没有交集的话,会类型推导出一个never类型
在这里插入图片描述

获取多个级联类型的并集

在这里插入图片描述

in 关键字

该关键字往往和keyof联用,限制某个索引类型取值范围

在这里插入图片描述
在这里插入图片描述

TS中预设的类型演算

Partial<T> 将类型T中的成员变为可选

样列
在这里插入图片描述
原理分析

/**
 * Make all properties in T optional
 */
type Partial<T> = {
    [P in keyof T]?: T[P]; // 使用泛型,把每一个属性都加上了可选的符号
};

Required<T> 将类型T中的成员变为必填

样列
在这里插入图片描述
原理分析

/**
 * Make all properties in T required
 */
type Required<T> = {
    [P in keyof T]-?: T[P];  // 这里的 - 号是去除条件 
};

Readonly<T> 将类型T中的成员变为只读

样列
在这里插入图片描述

源码分析

/**
 * Make all properties in T readonly
 */
type Readonly<T> = {
    readonly [P in keyof T]: T[P]; // 就是在前面加了一个修饰符
};

Exclude<T, U> 从T中剔除可以赋值给U的类型。

样例
在这里插入图片描述
源码分析

/**
 * Exclude from T those types that are assignable to U
 */
type Exclude<T, U> = T extends U ? never : T; // 通过继承来实在U 包含 T

Extract<T, U> 提取T中可以赋值给U的类型。

样例
在这里插入图片描述
源码分析

/**
 * Extract from T those types that are assignable to U
 */
type Extract<T, U> = T extends U ? T : never; // 和上面的exclude 相反的

NonNullable<T> 从T中剔除null和undefined。

样例
在这里插入图片描述
源码分析

/**
 * Exclude null and undefined from T
 */
type NonNullable<T> = T extends null | undefined ? never : T;

ReturnType<T> 获取函数返回值类型。

样例

-方式一:
在这里插入图片描述

  • 方式二:
    在这里插入图片描述

InstanceType<T> 获取构造函数类型的实例类型。

在这里插入图片描述

标签:typescript,const,ts,关键字,keyof,typeof,类型,type
来源: https://blog.csdn.net/qq_41499782/article/details/113604660

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有