TypeScript详解十三：内置工具类型

原创

已于 2023-07-09 18:00:20 修改 · 1.9k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#typescript #javascript #前端

于 2022-09-11 16:45:18 首次发布

本文详细介绍了TypeScript中的几个常用内置工具类型：Partial用于将接口的属性变为可选，Required将可选属性变为必填，Readonly使属性变为只读，Pick则用于从接口中选择特定属性，而Record则用于创建映射新类型的对象。通过示例代码展示了这些工具类型的使用方法及其源码实现。

前言

TS为了方便开发者使用，在内部提供了非常多的工具类型，如Partial、Required、ReadOnly等等，本篇文章主要用于记录了一些常用的内置工具类型的使用及源码实现，以便参考。

提示：以下是本篇文章正文内容，下面案例可供参考

一、什么是ts内置工具类型

TypeScript 附带了大量类型，可以帮助进行一些常见的类型操作，通常称为 Utility Types。

二、使用示例

1.Partial

将必填参数变为可选参数

namespace a {
   
   
  // 示例一：
  interface A {
   
   
    name: string,
    age: number,
    sex: string
  }
  // 接口A中的参数通过内置工具类型Partial变成了可选参数
  type PartialA = Partial<A>;
  let a: PartialA = {
   
   
    // 此处传参可以任意个数，但只能传已定义的参数
    name: '张三',
    age: 10
  }

  // 示例二：
  interface Company {
   
   
    id: number,
    name: string
  }
  interface Person {
   
   
    id: number,
    name: string,
    company: Company
  }
  // 实现DeepPartial，将参数深度转换成可选参数
  type DeepPartial<T> = {
   
   
    [U in keyof T]?: T[U] extends object ? DeepPartial<T[U]> : T[U];
  }
  type PartialPerson = DeepPartial<Person>;
  let p: PartialPerson = {
   
   
    // 此处的参数已经变为可选参数，可根据自己需要传递
    id: 10,
    name: '张三',
    company: {
   
   
      name: '美团'
    }
  }
}

Partial的实现源码

namespace b {
   
   
  interface A {
   
   
    name: string,
    age: number,
    sex: string
  }
  type Partial<T> = {
   
   
    // 原理：
    // 1.通过keyof拿到T中的所有key
    // 2.迭代所有的key
    // 3.统一加上可选参数处理
    // 4.返回迭代值的类型
    [P