返回 Typescript 中两种类型之一的方法

Question

我有以下方法，如果之前已注册，则应该返回组件对象

/**
 * Retrieve a component
 * @param       string      sComponentName      The name of the component to look for
 * @return      ComponentInterface | boolean
 */
public getComponent(sComponentName: string): boolean | ComponentInterface {
    if(!this.hasComponent(sComponentName)) {
        return false;
    }

    return this.components[sComponentName];
}

一切都编译并运行良好，但我的编辑器抛出以下警告......

Property 'x' does not exist on type 'boolean | ComponentInterface'

当我尝试跑步时...

const oPositionComponent = oEntity.getComponent('position');
console.log(oPositionComponent.x);

有没有更好的方法来编写此内容，以便我的编辑知道我想要实现的目标？

---

解决方案

好吧，因为我实际上是在上一步中检查组件是否存在，所以我只是对返回值进行了类型转换......

aEntities = aEntities.filter((oEntity) => {
    return oEntity.hasComponent('position');
});

aEntities.forEach((oEntity) => {
    const oPositionComponent = <ComponentInterface> oEntity.getComponent('position');
    this.context.translate(oPositionComponent.x, oPositionComponent.y);
});

Answer 1

由于它可能返回，false编译器假设 oPositionComponent.x 在这种情况下可能会失败。您可以断言类型（如果您确定您会获得组件并且不是 false：

console.log((<ComponentInterface>oPositionComponent).x);

但在生产质量代码中，您应该通过类型缩小来处理可能的错误返回：

if (oPositionComponent instanceof ComponentInterface) { // this will only work with classes, not interfaces (?)
    console.log(oPositionComponent.x);
} else { // this must be false
    console.log("component is not registered");
}