我目前正在尝试改进一些现有代码的类型。我的代码大致如下所示:
/* dispatcher.ts */
interface Message {
messageType: string;
}
class Dispatcher<M extends Message> {
on<
MessageType extends M["messageType"],
SubMessage extends M & { messageType: MessageType }
>(
messageType: MessageType,
handler: (message: SubMessage) => void
): void { }
}
/* messages.ts */
interface AddCommentMessage {
messageType: "ADD_COMMENT";
commentId: number;
comment: string;
userId: number;
}
interface PostPictureMessage {
messageType: "POST_PICTURE";
pictureId: number;
userId: number;
}
type AppMessage = AddCommentMessage | PostPictureMessage;
/* app.ts */
const dispatcher = new Dispatcher<AppMessage>();
dispatcher.on("ADD_COMMENT", (message: AddCommentMessage ) => {
/* ^^ REMOVE THIS TYPE HINT!*/
console.log(message.comment);
});
我想消除显式缩小传递给消息处理程序的消息类型(/*REMOVE THIS TYPE HINT!*/
所在的位置(的需要,以便它正确地缩小到具有匹配messageType
类型的类型(例如,如果messageType
是"ADD_COMMENT"
那么message
应该是AddCommentMessage
(。
如果现在无法做到这一点,请告诉我。我的印象是不是,但我不太确定。
这是不可能的,除非你愿意对代码进行相当多的更改。
您的基本界面
interface Message {
messageType: string;
}
太笼统了,我认为messageType: string
排除了基于messageType
值的任何推断,并且看起来不可能在Dispatcher
接口中充分缩小它的范围。
如果将代码限制为仅AppMessage
及其后代,下面是一个示例,如何使 typescript 推断所需的类型,由字符串文本类型引导(keyof AppMessageMap
实际上是字符串文字类型的联合"ADD_COMMENT" | "POST_PICTURE"
(:
/* dispatcher.ts */
class Dispatcher {
on<
MessageType extends keyof AppMessageMap
>(
messageType: MessageType,
handler: (message: AppMessageMap[MessageType] & {messageType: MessageType}) => void
): void { }
}
/* messages.ts */
interface AddCommentMessage {
commentId: number;
comment: string;
userId: number;
}
interface PostPictureMessage {
pictureId: number;
userId: number;
}
interface AppMessageMap {
"ADD_COMMENT": AddCommentMessage,
"POST_PICTURE": PostPictureMessage
}
type AppMessage = AppMessageMap[keyof AppMessageMap];
/* app.ts */
const dispatcher = new Dispatcher();
dispatcher.on("ADD_COMMENT", (message) => {
console.log(message.comment);
});
我还从接口中删除了messageType
属性以避免重复,我认为handler
参数中的交集类型达到了相同的效果。