Javascript Typescript-如何使用Typescript接口扩展模型

我有一个具有通用界面和一些扩展的任务：

export interface Task {
  name: string;
  id: number;
  type: taskType
}

export enum taskType {
  EVENT = 'EVENT',
  NOTES = 'NOTES',
}

以下是任务的扩展：

export interface EventTask extends Task {
  startDate: Date,
  endDate: Date
}

export interface NotesTask extends Task {
  description: string,
}

当我得到后端结果时，我可以得到这些数组，数据属性会根据类型发生变化：

[{id: 1, name: 'TaskNote1', type: 'NOTES', description: 'Hello world'}, {id: 2, name: 
'TaskEvent1', type: 'EVENT', startDate: '2021-04-04', endDate: '2021-04-19'}];

---

如何将这些变量模型导入任务界面？我找不到解决方案

您的数组类型为

（NotesTask | EventTask）[

。您可以使用

键入保护

来定义它们之间的差异。类型保护是一种排除值为错误类型的可能性的函数

类型保护使用

is

操作符告诉TypeScript哪种类型是哪种类型

例如：

const isNotesTask=（任务：NotesTask | EventTask）：任务为NotesTask=>{
return task.type===taskType.NOTES
}
const isEventTask=（任务：NotesTask | EventTask）：任务为EventTask=>{
return task.type===taskType.EVENT
}

您可以在

if

语句中这样使用：

//if语句外的任务类型为NotesTask | EventTask。
if（isNotesTask（任务））{
//在这里，任务的类型是NotesTask
}
if（isEventTask（任务））{
//此处任务的类型为EventTask
}

另一个答案很好，但我发现它比下面的解决方案有更多的样板文件，而且不够健壮：

接口属性{
名称：字符串；
id：编号；
}
导出类型任务=
|{type:'EVENT'，startDate:Date，endDate:Date}&CommonTaskProperties
|{type:'NOTES'，description:string}&CommonTaskProperties

然后你可以这样做：

const task: Task = {type: "NOTES", description: "This is a notes task."};

switch (task.type) {
    case 'EVENT':
        // Handle event task here
        break;
    case 'NOTES':
        // Handle notes task here
        break;
}

---

在每种情况下，类型都将被适当地推断出来，而不必使用显式类型保护或断言。

您能够更改这些类型中的任何一种吗<代码>枚举以编程方式使用很烦人，但这是可能的。您还希望

type

位于单个

EventTask

和

NotesTask

接口中，并将

任务重新定义为相关的。然后是日期字符串的反序列化和枚举值的反序列化。如果是，对你有用吗？如果是的话，我会写下来的。