TS映射类型

在了解映射类型之前,需要了解 keyof, never, typeof, in。

1.keyof:keyof 取 interface 的键

interface Point {
    x: number;
    y: number;
}
// type keys = "x" | "y"
type keys = keyof Point;

2.never:永远不存在的值的类型

使用 never 避免出现新增了联合类型没有对应的实现,目的就是写出类型绝对安全的代码。

3.typeof:取某个值的 type

const a: number = 3
 
// 相当于: const b: number = 4
const b: typeof a = 4

4.in:检查一个对象上是否存在一个属性

interface A {
  x: number;
}
interface B {
  y: string;
}
function doStuff(q: A | B) {
  if ('x' in q) {
    // q: A
  } else {
    // q: B
  }
}

映射类型就是将一个类型映射成另外一个类型,简单理解就是新类型以相同的形式去转换旧类型的每个属性。

一、Partial, Readonly, Nullable, Required

1.Partial 将每个属性转换为可选属性

type Partial<T> = {
    [P in keyof T]?: T[P];
}
type PersonPartial = Partial<Person>;

type PersonPartial = {
    name?: string | undefined;
    age?: number | undefined;
}
//?:是可以选的

2.Readonly 将每个属性转换为只读属性

type Readonly<T> = {
    readonly [P in keyof T]: T[P];
}
type PersonReadonly = Readonly<Person>;

type PersonReadonly = {
    readonly name: string;
    readonly age: number;
}

3.Nullable 转换为旧类型和null的联合类型

type Nullable<T> = { 
  [P in keyof T]: T[P] | null
}
type PersonNullable = Nullable<Person>;
type PersonNullable = {
      name: string | null;
      age: number | null;
}

4.Required 将每个属性转换为必选属性

type Required<T> = {
  [P in keyof T]-?: T[P]
}
//-?: 必选属性

二、Pick, Record

1.Pick 选取一组属性指定新类型

//K extends keyof T,应该是说key被约束在T的key中,不能超出这个范围,否则会报错的
type Pick<T, K extends keyof T> = {
  [P in K]: T[P];
}
interface Todo {
  title: string;
  description: string;
  completed: boolean;
}

type TodoPreview = Pick<Todo, "title" | "completed">;
const todo: TodoPreview = {
  title: "Clean room",
  completed: false,
};
todo; // = const todo: TodoPreview

2.Record 创建一组属性指定新类型,常用来声明普通Object对象

type Record<K extends keyof any, T> = {
  [P in K]: T;
}
interface PageInfo {
  title: string;
}
type Page = "home" | "about" | "contact";
 
const nav: Record<Page, PageInfo> = {
  about: { title: "title1" },
  contact: { title: "title2" },
  home: { title: "title3" },
};
nav.about; // = const nav: Record

三、Exclude, Omit

1.Exclude 去除交集,返回剩余的部分

type Exclude<T, U> = T extends U ? never : T
//Exclude类型,T是否在U内,在的never(永远不存在类型),不在是T
type Omit = Pick<T, Exclude<keyof T, K>>
 
// 相当于: type A = 'a'
type A = Exclude<'x' | 'a', 'x' | 'y' | 'z'>
 
interface Todo {
  title: string;
  description: string;
  completed: boolean;
}
 
type TodoPreview = Omit<Todo, "description">;
 
const todo: TodoPreview = {
  title: "a",
  completed: false,
};

2.Omit 适用于键值对对象的Exclude,去除类型中包含的键值对

interface Todo {
  title: string;
  description: string;
  completed: boolean;
}
 
type TodoPreview = Omit<Todo, "description">;
 
const todo: TodoPreview = {
  title: "a",
  completed: false,
};

四、ReturnType获取返回值类型,一般为函数

type ReturnType<T extends (...args: any) => any>
  = T extends (...args: any) => infer R ? R : any;
 
declare function f1(): { a: number; b: string };
type T1 = ReturnType<typeof f1>;
//    type T1 = {
//        a: number;
//        b: string;
//    }

链接: https://www.cnblogs.com/libaidwz/p/15189205.html.

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值