TypeScript utility-types插件

曹焱
2023-12-01
作用

对TypeScript内置映射类型和别名的补充。

下载
NPM 
npm install utility-types
 
YARN 
yarn add utility-types
类型介绍
  1. FunctionKeys<T> 拿到对象中所有函数类型属性的 key
import { FunctionKeys } from 'utility-types';
 
type MixedProps = { name: string; setName: (name: string) => void };
 
// 得到: "setName"
type Keys = FunctionKeys<MixedProps>;
  1. NonFunctionKeys<T> 拿到对象中所有非函数类型属性的 key
  2. ReadonlyKeys<T>拿到对象中所有只读的 key
import { ReadonlyKeys } from 'utility-types';
 
type Props = { readonly foo: string; bar: number };
 
// 得到: "foo"
type Keys = ReadonlyKeys<Props>;
  1. MutableKeys<T>拿到对象中非只读的 key(与ReadonlyKeys相反)
  2. RequiredKeys<T>拿到对象中必选的 key
import { RequiredKeys } from 'utility-types';
 
type Props = { req: number; reqUndef: number | undefined; opt?: string; optUndef?: number | undefined; };
 
// 得到: "req" | "reqUndef"
type Keys = RequiredKeys<Props>;
  1. OptionalKeys<T>拿到对象中非必选的 key(与RequiredKeys相反)
  2. Optional<T>拿到将对象中的必填key变为非必选
import { Optional } from 'utility-types';
 
type Props = { name: string; age: number; visible: boolean; };
 
// 得到: { name?: string; age?: number; visible?: boolean; }
type Props = Optional<Props>

// 也可指定键名,得到: { name: string; age?: number; visible?: boolean; }
type Props = Optional<Props, 'age' | 'visible'>;
  1. Pick<T, K>从T中选出键名为K键值对
type Props = { name: string; age: number; visible: boolean };
 
// 得到: { age: number; }
type Props = Pick<Props, 'age'>;
  1. PickByValue<T, ValueType>从T中选出键值为K键值对
import { PickByValue } from 'utility-types';
 
type Props = { req: number; reqUndef: number | undefined; opt?: string; };
 
// 得到: { req: number }
type Props = PickByValue<Props, number>;

// 得到: { req: number; reqUndef: number | undefined; }
type Props = PickByValue<Props, number | undefined>;
  1. Omit<T, K>返回从T中移出键名为K后的键值对
import { Omit } from 'utility-types';
 
type Props = { name: string; age: number; visible: boolean };
 
// 得到: { name: string; visible: boolean; }
type Props = Omit<Props, 'age'>;
  1. OmitByValue<T, ValueType>返回从T中移出键值为K后的键值对(匹配键值包括K的键值对)
  2. OmitByValueExact<T, ValueType>返回从T中移出键值为K后的键值对(匹配键值===K的键值对)
//OmitByValue与OmitByValueExact的区别
import { OmitByValue } from 'utility-types';
 
type Props = { req: number; reqUndef: number | undefined; opt?: string; };
 
type Props = OmitByValue<Props, number>;  // 得{ reqUndef: number | undefined; opt?: string; }
type Props = OmitByValueExact<Props, number>;  // 得{ reqUndef: number | undefined; opt?: string; }
type Props = OmitByValue<Props, number | undefined>;  // 得{ opt?: string; }
type Props = OmitByValueExact<Props, number | undefined>;  //得{ req: number; opt?: string }
  1. Intersection<T, U>在T中查找与U相同的键值对返回
import { Intersection } from 'utility-types';
 
type Props = { name: string; age: number; visible: boolean };
type DefaultProps = { age: number };
 
// 得到: { age: number; }
type DuplicatedProps = Intersection<Props, DefaultProps>;
  1. Diff<T, U> 在T中查找与U不同的键值对返回(同Intersection相反)
  2. Subtract<T, U> 删除T中所有与U相同得键值对
import { Intersection } from 'utility-types';
 
type Props = { name: string; age: number; visible: boolean };
type DefaultProps = { age: number };
 
// 得到: { name: string;  visible: boolean };
type DuplicatedProps = Subtract<Props, DefaultProps>;
  1. Overwrite<T, U> //根据U中键值对对T中键值对进行改写(不包括新增)
import { Overwrite } from 'utility-types';
 
type Props = { name: string; age: number; visible: boolean };
type NewProps = { age: string; other: string };
 
// 得: { name: string; age: string; visible: boolean; }
type ReplacedProps = Overwrite<Props, NewProps>;
  1. Assign<T, U> 将U有T无的属性添加到T
import { Assign } from 'utility-types';
 
type Props = { name: string; age: number; visible: boolean };
type NewProps = { age: string; other: string };
 
// Expect: { name: string; age: number; visible: boolean; other: string; }
type ExtendedProps = Assign<Props, NewProps>;
  1. ValuesType<T>返回对象中所有键值的并集

  2. Partial<T>将T中属性转换为可选属性。返回的类型可以是T的任意子集。

  3. Required<T, K>通过将T的属性设置为必选属性来构造一个新的类型(同Partial相反)

import { Required } from 'utility-types';
 
type Props = { name?: string; age?: number; visible?: boolean; };
 
// 得到: { name: string; age: number; visible: boolean; }
type Props = Required<Props>

// 可选择具体键值对,得到: { name?: string; age: number; visible: boolean; }
type Props = Required<Props, 'age' | 'visible'>;
  1. Readonly<T>将所有键值对变为只可读
  2. Mutable<T>将所有键值对变为非可读(与Readonly相反)
  3. Unionize<T>将整个对象中所有键值对拆分为一个个独立对象的并集
import { Unionize } from 'utility-types';
 
type Props = { name: string; age: number; visible: boolean };
 
// 得到: { name: string; } | { age: number; } | { visible: boolean; }
type UnionizedType = Unionize<Props>;
  1. PromiseType<T>取得Promise修饰类型的键值
import { PromiseType } from 'utility-types';
 
// 得到: string
type Response = PromiseType<Promise<string>>;
  1. DeepReadonly<T>层层变为可读
import { DeepReadonly } from 'utility-types';
 
type NestedProps = {
  first: {
    second: {
      name: string;
    };
  };
};
 
 type ReadonlyNestedProps = DeepReadonly<NestedProps>;
// 得到: {
//   readonly first: {
//     readonly second: {
//       readonly name: string;
//     };
//   };
// }
  1. DeepRequired<T>层层取消可读属性(与DeepReadonly 相反)
  2. DeepNonNullable<T>层层取消可选属性
import { DeepNonNullable } from 'utility-types';
 
type NestedProps = {
  first?: null | {
    second?: null | {
      name?: string | null | undefined;
    };
  };
};
 
// 得到: {
//   first: {
//     second: {
//       name: string;
//     };
//   };
// }
type RequiredNestedProps = DeepNonNullable<NestedProps>;
  1. DeepPartial<T>层层变为可选属性
  2. UnionToIntersection<U>将且变为或
import { UnionToIntersection } from 'utility-types';
 
// 得到: { name: string } & { age: number } & { visible: boolean }
UnionToIntersection<{ name: string } | { age: number } | { visible: boolean }>

(摘自:https://www.npmjs.com/package/utility-types)

 类似资料: