首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >TypeScript使用泛型类型的泛型类型作为值类型

TypeScript使用泛型类型的泛型类型作为值类型
EN

Stack Overflow用户
提问于 2021-10-19 14:07:32
回答 1查看 127关注 0票数 0

如果不给出一个示例,这个问题很难解释,所以让我们看看这个Message类型,它将被扩展并用作其他类型的基本类型。

代码语言:javascript
复制
interface Message<E extends string = string, P = any> {
  topic: E;
  params: P;
}

我有这个接口来指示消息类型。主题和参数是通用的,以确保接口可以扩展到不同的情况,如:

代码语言:javascript
复制
interface OrderParams {
  userId: string;
  orderId: string;
}

interface CreateOrderMessage extends Message<'orders.create', OrderParams> {}
interface UpdateOrderMessage extends Message<'orders.update', OrderParams> {}
...

type CustomMessage = CreateOrderMessage | UpdateOrderMessage | ...;

这允许我为不同的主题类型添加严格的topicparams类型,我可以在类中使用这些类型:

代码语言:javascript
复制
class PubSub<T extends Message = Message> {
  publish(message: T): void;
  subscribe(topic: string): void;
}

如果我们将CustomMessage作为泛型类型传递给PubSub<>,它将检查publish方法的类型,但我也希望确保使用T extends Message泛型类型的E泛型类型检查subscribe方法的topic参数。

那么,是否有一种方法可以提取另一种泛型类型的泛型类型,这样我就可以编写如下所示的内容?

代码语言:javascript
复制
subscribe(topic: GenericOf<T, 0>);             // 1st generic of T type
subscribe(topic: TypeOfObjectKey<T, 'topic'>); // Type of 'topic' property of T type
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-10-19 14:30:51

subscribe(topic: T['topic'])将确保subscribetopic参数与传递给泛型的接口的topic属性的类型相同。下面是一个从您在问题中提供的代码派生出来的示例(我做错了,这样底层类型就很容易看到):

代码语言:javascript
复制
interface Message<E extends string = string, P = any> {
  topic: E;
  params: P;
}

interface OrderParams {
  userId: string;
  orderId: string;
}

interface CreateOrderMessage extends Message<'orders.create', OrderParams> {}
interface UpdateOrderMessage extends Message<'orders.update', OrderParams> {}

type CustomMessage = CreateOrderMessage | UpdateOrderMessage;

class PubSub<T extends Message = Message> {
  publish(message: T): void {};
  subscribe(topic: T['topic']): void {};
}

new PubSub<CustomMessage>().subscribe('')
                                      ^^
Argument of type '""' is not assignable to parameter of type '"orders.create" | "orders.update"'.

- TypeScript游乐场

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/69632375

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档