Typescript 联合类型 : Dealing with Interfaces

标签 typescript

如果您有两个足够相似的接口(interface),您希望通过相同的逻辑来运行它们,那么处理这种情况的正确方法是什么:

interface DescriptionItem {
    Description: string;
    Code: string;
}
interface NamedItem {
    Name: string;
    Code: string;
}

function MyLogic(i: DescriptionItem | NamedItem) {
    var desc = (<DescriptionItem>i).Description || (<NamedItem>i).Name;

    return i.Code + ' - ' + desc;
}

这行得通;但是,我的问题是关于改进 var desc = ... 行。我所拥有的是最好的选择吗?或者在 Typescript 中有更好的方法来处理这种情况吗?

最佳答案

TypeScript interfaces 仅在编译时存在,因此您无法在运行时测试接口(interface)类型。您在问题中指定的代码很有意义,可能是您的最佳选择。

但是,如果您可以灵活地将 interfaces 更改为 classes,则可以使用 TypeScript 的类型保护来进行更优雅的类型检查:

class DescriptionItem {
    Description: string;
    Code: string;
}
class NamedItem {
    Name: string;
    Code: string;
}

function MyLogic(i: DescriptionItem | NamedItem) {
    let desc: string;
    if (i instanceof DescriptionItem) {
        desc = i.Description;
    } else {
        desc = i.Name;
    }

    return i.Code + ' - ' + desc;
}

关于Typescript 联合类型 : Dealing with Interfaces,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35726858/

相关文章:

npm - Angular2 beta - 引导 HTTP_PROVIDERS - "Unexpected Token <"

javascript - React/TypeScript - 类型 'false | Element' 不可分配给类型 'Element'

字符串属性的 TypeScript 接口(interface)默认值

javascript - WebStorm:仅在保存时可以转译 TypeScript 文件

typescript - Jest : await vs setImmediate vs useFakeTimers vs new Promise(setImmediate)

javascript - Angular 2 模板方法与 getter

javascript - 根据可能为 null 的属性对数组进行排序

angular - 将 aws-sdk 集成到 angular2 得到 "Cannot find module ' 流'"

javascript - 恢复 + typescript :

node.js - 无法使用 webpack 加载 spfx 解决方案的 sp-loader