上文中介绍了 对象操作的内置类型的使用,本文介绍几个基于内置类型,扩展的自定义类型,(类型名称自定义的)

将部分属性变为可选属性

实现思路:先将 name 属性挑出来变为可选的 & 除了 name 属性的

// 有时处理类型之后,对象类型结构不明显。只是简单做一个映射,并未其他意义。
type Compute<T extends object> = {
[K in keyof T]: T[K]; // 映射
};
interface Person {
name: string;
age: number;
address: string;
}
// 先将name属性挑出来变为可选的 & 除了name属性的
// Partial<Pick<T, K>> & & Omit<T, K> type PartialPropsOption<T, K extends keyof T> = Partial<Pick<T, K>> & Omit<T, K>; type x1 = PartialPropsOption<Person, "name">;
type x2 = Compute<PartialPropsOption<Person, "name">>; // 使用Compute包一层可以看清楚结构,不包也可以

根据值的类型 反选 key

之前的常见做法都是用过 key 值来获取属性,反之,如果根据值的类型 反选 key?

写法一:基础原理写法,使用不同的内置类型,Pick 和 Omit

定义一个接口 Person。通过不同的内置类型,实现挑选 值类型为string的keys过滤 值类型为string的keys

interface Person {
name: string;
age: number;
address: string;
}
// 判断两个类型是否相等
type isEqual<T, U, Success, Fail> = [T] extends [U] ? ([U] extends [T] ? Success : Fail) : Fail; type ExtractKeysByValueType<T, U> = {
[K in keyof T]: isEqual<T[K], U, K, never>;
}[keyof T]; // 找到需要的属性 name | address **注:联合类型中没有never type PickKeysByValue<T, U> = Pick<T, ExtractKeysByValueType<T, U>>;
type PickedKeys = PickKeysByValue<Person, string>; // 挑选 值类型为string的keys 返回 name address type OmitKeysByValue<T, U> = Omit<T, ExtractKeysByValueType<T, U>>;
type OmitedKeys = OmitKeysByValue<Person, string>; // 过滤 值类型为string的keys 返回 age

写法二:基础原理写法,使用 Pick 内置类型 + 传参的方式

interface Person {
name: string;
age: number;
address: string;
}
// 判断两个类型是否相等
type isEqual<T, U, Success, Fail> = [T] extends [U] ? ([U] extends [T] ? Success : Fail) : Fail; type ExtractKeysByValueType<T, U, O = false> = {
[K in keyof T]: isEqual<T[K], U, isEqual<O, true, never, K>, isEqual<O, true, K, never>>;
}[keyof T]; // 找到需要的属性 name | address **注:联合类型中没有never type PickKeysByValue<T, U> = Pick<T, ExtractKeysByValueType<T, U>>;
type PickedKeys = PickKeysByValue<Person, string>; // 挑选 值类型为string的keys 返回 name address type OmitKeysByValue<T, U> = Pick<T, ExtractKeysByValueType<T, U, true>>;
type OmitedKeys = OmitKeysByValue<Person, string>; // 过滤 值类型为string的keys 返回 age

写法三:使用映射条件做双重映射

interface Person {
name: string;
age: number;
address: string;
}
type PickKeysByValue<T extends object, U> = {
// [K in keyof T as `a_${K & string}`]: T[K]; // 使用模板字符串 重命名 // as 语法 映射成一个新的变量
[K in keyof T as T[K] extends U ? K : never]: T[K];
}; type PickKeysByAs = PickKeysByValue<Person, string>; // 挑选 值类型为string的keys 返回 name address

求对象的交集 ObjectInter

交集:指的是类型中的属性属性属性,即存在于 A 中,又存在于 B 中,属性的类型可以不同,取交集后者类型,

type A = {
name: string;
age: number;
address: string;
}; type B = {
name: string;
male: boolean;
address: number;
};
// 返回的是联合类型 name | address
type ObjectInter<T extends object, U extends object> = Pick<U, Extract<keyof T, keyof U>>; type X1 = ObjectInter<A, B>; // 从B中取A,address类型取B中的类型 number

求对象的差集 ObjectDiff

算一下 B - A,使用内置类型组合:Omit + Extract == Pick + Exclude

组合的写法比较多种,只要可以实现就可以,需要注意的是 谁-谁,就是从哪个对象中挑选

type A = {
name: string;
age: number;
address: string;
}; type B = {
name: string;
male: boolean;
address: number;
};
type ObjectDiff<T extends object, U extends object> = Omit<U, Extract<keyof T, keyof U>>;
type X2 = ObjectDiff<A, B>; // B - A = male: boolean; type ObjectDiff2<T extends object, U extends object> = Pick<T, Exclude<keyof T, keyof U>>;
type X3 = ObjectDiff2<A, B>; // A - B = age: number; type OmitDiff<T extends object, U extends Object> = Omit<T, keyof U>;
type X4 = OmitDiff<A, B>; // A - B = age: number;

求对象的并集 ObjectMerge

希望最终得到的结果是 type X7 = { age: number; name: string; address: number; male: boolean;}

实现思路:先找出A - B的差集,再& B

type A = {
name: string;
age: number;
address: string;
}; type B = {
name: string;
address: number;
male: boolean;
};
type Compute<T extends object> = {
[K in keyof T]: T[K]; // 只是做了映射,为了显示类型结果
}; type ObjectMerge<T extends object, U extends object> = Omit<T, keyof U> & U;
type X5 = Compute<ObjectMerge<A, B>>;

求对象的补集 ObjectComp

补集:存在于 A 中,不存在于 B 中,属性相差。互补,注意:双方得存在父子关系,才能互补 也就是 B 是 A 的子类型

type A = {
name: string;
age: number;
address: string;
}; type B = {
name: string;
address: string;
}; // 类型“B” 需要满足约束 “A”。
type ObjectComp<T extends object, U extends T> = Omit<U, Extract<keyof T, keyof U>>;
type X6 = ObjectComp<B, A>; // age: number;

重写对象类型 Overwrite

使用 B 重写 A 中相同的属性,案例中就是 使用 address: string => address: number,其他不变

希望最终得到的结果是 A=> { name: string; age: number; address: number }

实现思路:先找出交集,在找差集,利用上边已经实现的代码

type A = {
name: string;
age: number;
address: string;
}; type B = {
name: string;
address: number;
male: boolean;
};
type Compute<T extends object> = {
[K in keyof T]: T[K]; // 只是做了映射,为了显示类型结果
}; type Overwrite<T extends object, U extends object> = ObjectInter<A, B> & ObjectDiff2<A, B>;
type X7 = Compute<Overwrite<A, B>>;

TypeScript 学习笔记 — 自定义类型:部分属性可选,反选 key,求对象交差并补集等(十三)的更多相关文章

  1. Typescript 学习笔记六:接口

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  2. Typescript 学习笔记五:类

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  3. Typescript 学习笔记三:函数

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  4. SQL反模式学习笔记6 支持可变属性【实体-属性-值】

    目标:支持可变属性 反模式:使用泛型属性表.这种设计成为实体-属性-值(EAV),也可叫做开放架构.名-值对. 优点:通过增加一张额外的表,可以有以下好处 (1)表中的列很少: (2)新增属性时,不需 ...

  5. Typescript 学习笔记七:泛型

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  6. Typescript 学习笔记四:回忆ES5 中的类

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  7. Typescript 学习笔记二:数据类型

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  8. Typescript 学习笔记一:介绍、安装、编译

    前言 整理了一下 Typescript 的学习笔记,方便后期遗忘某个知识点的时候,快速回忆. 为了避免凌乱,用 gitbook 结合 marketdown 整理的. github地址是:ts-gitb ...

  9. TypeScript学习笔记(八):1.5版本之后的模块和命名空间

    我之前有写过TS1.5版本之前的“模块”的笔记:TypeScript学习笔记(七):模块 但是TS这里的模块和在ECMAScript 2015里的模块(即JS原生支持了模块的概念)概率出现了混淆,所以 ...

  10. iOS学习笔记-自定义过渡动画

    代码地址如下:http://www.demodashi.com/demo/11678.html 这篇笔记翻译自raywenderlick网站的过渡动画的一篇文章,原文用的swift,由于考虑到swif ...

随机推荐

  1. vue中form表单校验,一个form-item中有多个必填项如何操作?

    普通的正则校验就不具体写了. 项目中遇到一个el-form-item含有多个input或者select,如何绑定值? // 一个form-item中有多个必填项 <el-form-item la ...

  2. centos7 硬盘扩容

    参考 linux系统下,新加硬盘并把现有的/home目录扩容 最后加的容量在/目录 而不是在/home目录,而我本来把/home目录独立挂载在一个分区了 创建逻辑卷.可用使用命令 pvcreate / ...

  3. 问题记录[ PPOME 修改子屏幕日期弹框,No changes to data, periods undone. Message no. 5A496 ]

    最近在做组织信息增强,将子屏幕嵌入PPOME后,修改日期后会弹出信息框并重置300屏幕的开始日期.且PO13和PP01无异常 刚开始以为7000屏幕配置问题,但是对比后并没发现异常.跟踪消息号发现函数 ...

  4. 2月21日python程序设计

    Python变量 1.不需要事先声明变量名及其类型,直接赋值即可. 2.强类型编程语言,根据赋值或运算来推断变量类型. 3.动态类型语言,变量的类型也是可以随时变化的. >>>  x ...

  5. prometheus 配置数据保留7天时间storage.tsdb.retention.time

    1.修改配置如下: 默认24h添加配置:retention: 168h

  6. 打开CMD的方式

    打开Cmd的方式: 1.开始+系统+命令提示符 2.Win键+R 3.在任意文件夹下,按住Shift键+鼠标右键点击,在此处打开命令行窗口 4.资源管理的地址栏前面加上Cmd路径 管理员运行方式 :系 ...

  7. Spring 笔记三 AOP

    1.AOP 概述 AOP (Aspect-Oriented  Programming,面向切面编程):是一种新的方法论,是对传统 OOP (Object-Oriented  Programming,面 ...

  8. jxg项目Day1-配置

    1.搭建mysql与datagrip的连接(还未完成建表学习) 2.搭好项目框架:目前划分: maven我是直接复制的之前的两个项目的依赖,但是测试的时候遇到点问题:说数据库连不上,但是我明明已经配置 ...

  9. consul 服务注册与更新

    服务注册与发现是微服务架构中不可或缺的重要组件. 起初服务都是单节点的,不保障高可用性,也不考虑服务的压力承载,服务之间调用单纯的通过接口访问.直到后来出现了多个节点的分布式架构,起初的解决手段是在服 ...

  10. java: javacTask: 源发行版 8 需要目标发行版 1.8

    idea同一工作空间中不同工程使用不同的jkd版本.在本地idea同时使用jdk1.7和jdk1.8,不同的java工程使用不同的jdk版本,但是在java代码编译时报错,其报错信息为:[java: ...