让我们假设我有这两种类型:

type Foo = {
  foo: string
}

type Bar = {
  bar: number
}

有没有一种方法可以在不创建包装器类型的情况下键入对象文字的各个字段(如果存在的话,我正在寻找正确的语法)?

This is what I want to avoid:

type Wrapper = {
  a: Foo
  b: Bar
}

const x: Wrapper = {
  a: { foo: 'foo' },
  b: { bar: 123 }
}

This is what I'm trying to do:

const x = {
  // x.a should be of type Foo, enforced by the compiler
  a: { foo: 'foo' },
  // x.b should be of type Bar, enforced by the compiler
  b: { bar: 123 }
}

What I considered, but is not suitable:

  1. 使用Record类型没有任何意义,因为我丢失了各个字段及其各个类型:
const x: Record<string, Foo | Bar> = {
  a: { foo: 'foo' },
  b: { bar: 123 }
}
  1. 类型转换(或在TS中叫它什么)也不合适,因为现在我放松了编译器判断和内容辅助.至少在这个版本中,x的类型是正确的:
const x = {
  a: { foo: 'foo' } as Foo,
  b: { bar: 123 } as Bar
}

推荐答案

看起来你要找的是TypeScript 4.9年中推出的satisfies运营商.它允许保留literal type,同时仍然使用一些约束进行类型判断.

const x = {
  a: { foo: "223" },
  b: { bar: 123 }
} satisfies Record<string, Foo | Bar>

x.a.foo // string
x.b.bar // number

Playground

Typescript相关问答推荐

界面中这种类型的界面界面中的多态性

类型脚本泛型最初推断然后设置

数组文字中对象的从键开始枚举

具有泛型类方法的类方法修饰符

打字脚本中泛型和直接类型重新映射的不同行为

无法绑定ngModel.条件ngSwitchCase中的错误

编剧错误:正在等待Expect(Locator).toBeVisible()

类型TTextKey不能用于索引类型 ;TOption

如何通过TypeScrip中的函数防止映射类型中未能通过复杂推理的any值

Angular 自定义验证控件未获得表单值

在React中定义props 的不同方式.FunctionalComponent

为什么我的导航在使用Typescript的React Native中不起作用?

从route.参数获取值.订阅提供";无法读取未定义";的属性

使用Type脚本更新对象属性

Typescript .根据枚举输入参数返回不同的对象类型

来自枚举的<;复选框和组件列表

TypeScript:如何使用泛型和子类型创建泛型默认函数?

React-跨组件共享功能的最佳实践

如何将元素推入对象中的类型化数组

将对象数组传递给 Typescript 中的导入函数