TypeScript 之 Record

正文

在 TS 中,类似数组、字符串、数组、接口这些常见的类型都非常常见,但是如果要定义一个对象的 key 和 value 类型该怎么做呢?这时候就需要用到 TS 的 Record 了。

上代码:

interface PageInfo {
  title: string;
}

type Page = "home" | "about" | "contact";

const nav: Record<Page, PageInfo> = {
  about: { title: "about" },
  contact: { title: "contact" },
  home: { title: "home" },
};

很好理解,Record 后面的泛型就是对象键和值的类型。

比如我需要一个对象,有 ABC 三个属性,属性的值必须是数字,那么就这么写:

type keys = 'A' | 'B' | 'C'
const result: Record<keys, number> = {
  A: 1,
  B: 2,
  C: 3
}

好吧,其实很简单。但是之前我真的不知道这个属性,都是这么写的[捂脸]。

const obj: any = {}

参考资料

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 本文记录一些vue3+ts+less开发过程中的一些小问题。不断开发、不断更新... 1. 引用.vue文件报错(...
    俄小发阅读 5,624评论 1 5
  • 官方handbook[https://www.typescriptlang.org/docs/handbook/i...
    ShoneSingLone阅读 597评论 0 0
  • 本文原创:nanyifei 前言 近几年,前端领域得到了日新月异的发展,各种新技术、框架层出不穷,前端的圈子越来越...
    jad_design阅读 1,086评论 0 1
  • 1. 编程语言的类型 : 动态类型语言 和 静态类型语言(c\ C++ \Jave) 2. Typescr...
    大佬_娜阅读 639评论 0 0
  • 久违的晴天,家长会。 家长大会开好到教室时,离放学已经没多少时间了。班主任说已经安排了三个家长分享经验。 放学铃声...
    飘雪儿5阅读 7,566评论 16 22