typescript——高级类型

Partial

interface Itest {
  webName: string;
  age: number;
  address: string;
}
type ant = Partial<Itest>;
/* type ant = {
  webName?: string;
  age?: number;
  address?: string;
} */

Required

interface Itest {
  webName: string;
  age: number;
  address: string;
}
type ant = Required<Itest>;
/* type ant = {
  webName: string;
  age: number;
  address: string;
} */

Readonly

interface Itest {
  webName: string;
  age?: number;
  address: string;
}
type ant = Readonly<Itest>;
/* type ant = {
  readonly webName: string;
  readonly age?: number;
  readonly address: string;
} */

Pick

interface Itest {
  webName: string;
  age?: number;
  address: string;
}
type ant = Pick<Itest, 'age' | 'address'>;
/* type ant = {
  age?: number;
  address: string;
} */

Omit

interface Itest {
  title: string;
  description: string;
  completed: boolean;
}

type ant = Omit<Itest, "description">;

/* type ant = {
  title: string,
  completed: boolean,
} */

Record

interface Itest {
  webName: string;
  age?: number;
  address: string;
}
type ant = Record<'age' | 'address', number>;
/* type ant = {
  age: number;
  address: number;
} */

keyof

keyof 是索引类型查询操作符。
假设T是一个类型,那么keyof T产生的类型是T的属性名称字符串字面量类型构成的联合类型。
特别说明: T是数据类型,并非数据本身。
代码实例如下:

interface Itest {
  webName: string;
  age: number;
  address: string;
}
type ant = keyof Itest; // type ant = "webName" | "age" | "address"

ValueOf

同 keyof,是值类型的查询操作符

type ValueOf<T> = T[keyof T];

interface Itest {
  webName: string;
  age: number;
  address: string;
}
type ant = ValueOf<Itest>; // type ant = string | number

条件类型

type T00 = Exclude<"a" | "b" | "c" | "d", "a" | "c" | "f">;  // "b" | "d"
type T01 = Extract<"a" | "b" | "c" | "d", "a" | "c" | "f">;  // "a" | "c"

type T02 = Exclude<string | number | (() => void), Function>;  // string | number
type T03 = Extract<string | number | (() => void), Function>;  // () => void

type T04 = NonNullable<string | number | undefined>;  // string | number
type T05 = NonNullable<(() => string) | string[] | null | undefined>;  // (() => string) | string[]

function f1(s: string) {
    return { a: 1, b: s };
}

class C {
    x = 0;
    y = 0;
}

type T10 = ReturnType<() => string>;  // string
type T11 = ReturnType<(s: string) => void>;  // void
type T12 = ReturnType<(<T>() => T)>;  // {}
type T13 = ReturnType<(<T extends U, U extends number[]>() => T)>;  // number[]
type T14 = ReturnType<typeof f1>;  // { a: number, b: string }
type T15 = ReturnType<any>;  // any
type T16 = ReturnType<never>;  // any
type T17 = ReturnType<string>;  // Error
type T18 = ReturnType<Function>;  // Error

type T20 = InstanceType<typeof C>;  // C
type T21 = InstanceType<any>;  // any
type T22 = InstanceType<never>;  // any
type T23 = InstanceType<string>;  // Error
type T24 = InstanceType<Function>;  // Error

实例

interface One {
  name: string;
}
interface Two {
  age: number;
}

type ValueOf<T> = T[keyof T];
type Key = keyof One | keyof Two;
type Value = ValueOf<One> | ValueOf<Two>;
type Entire = Required<One> & Partial<Two>;

function test0(c: Key) {
  return c;
}
console.log(test0('age')); // 'age' | 'name'

function test1(c: Value) {
  return c;
}
console.log(test1(0)); // string | number

const test2: Entire = {
  // Required<One> & Partial<Two>
  name: 'bob',
  age: 12,
};
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值