typescript - 在 typescript 中定义对象形状变体

Question

我正在尝试定义一个可以包含数据或错误的对象。

export type ActionResult = {
  data: any;
} | {
  error: any;
};

function test():ActionResult {
    return {
        data: 3
    }
}

当尝试访问我得到的函数的结果时:

const v = test();
v.data = 23; // Property 'data' does not exist on type 'ActionResult'.  Property 'data' does not exist on type '{ error: any; }'

访问“数据”或“错误”的正确方法是什么？

Answer 1

以下是 TypeScript 理解您的代码的方式:

const v = test();
// v: {data: any} | {error: any}
v.data = 23;
// It is possible that 'v' is of type '{error: any}'
// In this case, an error might happen at runtime
// This error must be prevented right now - time to throw a TS error!

确保不会发生这种情况的一种方法是使用 type guard将联合类型限制为不会引发 TS 错误的类型:

const v = test();
// v: {data: any} | {error: any}
if ('data' in v) {
  // v: {data: any}
  v.data = 23;
  // no error!
}

您还可以通过在定义 v 时强制转换 v 来告诉 TypeScript 您确定 v 将拥有 data:

const v = (test() as {data: any});
v.data = 23;

在 typescript playground 上检查此代码