TS常用类型体操梳理

102 阅读1分钟

TS常用类型体操

关键字:extends,keyof,in,omit,pick,interface.

// import { type } from 'os';

// import { type } from 'os';

// const data = {
//   a: 3,
//   hello: 'world',
//   1: 2,
// };
// 原始方法
// function get(o: object, name: string) {
//   return o[name];
// }
// keyof增强属性方法
// function get<T extends object, K extends keyof T>(o: T, name: K): T[K] {
//   return o[name];
// }

// console.log(get(data, 1));

// type a = ['1', '2', '3', '4'];

// type b = keyof a;

// const c: b = 5;

// console.log(c, 'cccc====');

// Omit高效定义复合 ---- 过滤不需要的类型
// Exclude 过滤返回的属性
// type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;

// type Pick<T, K extends keyof T> = {
//   [P in K]: T[P];
// };

interface User {
  id: number;
  age: number;
  name: string;
}

// 1.Partial用法
type partial<T> = {
  [P in keyof T]?: T[P];
};
type partialUser = partial<User>;

const a1: partialUser = {
  id: 1,
  age: 18,
  name: '可不填--字符串name',
};
console.log(a1, 'a1======');

// 2。 Pick的用法
// type Pickw<T, K extends keyof T> = {
//   [P in K]: T[P];
// };
type PickUser = Pick<User, 'id' | 'age'>;

const a2: PickUser = {
  id: 123,
  age: 12,
};
console.log(a2, 'a2====');

type RequiredUser = Required<User>;

const a3: RequiredUser = {
  id: 1,
  age: 18,
  name: 'name也是必填',
};
console.log(a3, 'a3====');

// extends声明函数  基础用法1
function extendFunc<T extends { id: number; render(n: number) }>(arr: T[]) {
  arr.map((a) => a.render(a.id));
}
extendFunc([
  {
    id: 123,
    render(n) {
      return n;
    },
  },
]);
// extends声明函数 基础用法2
type oper1 = {
  name: string;
  age: number;
  sex: string;
};
interface oper2 extends oper1 {
  car: string;
}
const test: oper2 = {
  name: '字符串name',
  age: 18,
  sex: '男',
  car: 'Mercedes-Benz',
};
console.log(test, 'test=====');

interface EXTENDopea2 extends Omit<oper1, 'sex'> {
  car: string;
  sex: number;
}
const test2: EXTENDopea2 = {
  name: 'name',
  sex: 1,
  age: 12,
  car: 'BMW',
};
console.log(test2, 'test2=====');

interface PickOpea2 extends Pick<oper1, 'sex'> {
  car: string;
}
const test3: PickOpea2 = {
  car: 'BMW',
  sex: 'string',
};
console.log(test3, 'test3=====');