打字稿无法识别元组的类型

Question

我有这个示例代码。第一个 console.log 被打字稿视为有效，但是当我将状态检查提取到函数时，它无法识别资源始终可用。它给出了

'resource' is possibly 'undefined'.(18048)

错误。

看游乐场

enum Status {
  Fetching,
  Available,
  Error
}

type Resource = Record<string, string>

type Available = [Resource, Status.Available];
type NotAvailable = [undefined, Status.Fetching | Status.Error];

const isAvailableStatus = (status: Status) => status === Status.Available;

const getResource = (): Available | NotAvailable => {
  return [undefined, Status.Fetching];
}

const [resource, resourceStatus] = getResource();

if (resourceStatus === Status.Available) {
  console.log(resource.test);
}

if (isAvailableStatus(resourceStatus)) {
  console.log(resource.test);
}

我的现实生活问题更复杂，因此提取 isAvailableStatus 检查是有意义的。当然，我可以为资源添加一个爆炸！，但我不明白为什么没有它就无法工作。

有什么方法可以实现这个功能吗？

Answer 1

这是解构时刻

const [resource, resourceStatus] = getResource();

，TypeScript 失去了对联合体的理解。

如果您不解构并使用索引访问，它就可以正常工作（参见游乐场）。

我的思维模型是，当您将 Tuple 类型的元组解构为各个字段时，这些字段不再是元组的一部分。

因此，在您的示例中，这意味着

const [resource, resourceStatus] = getResource();

类似于：

const tuple = getResource();
const resource = tuple[0]; // Resource | undefined
const status = tuple[1]; // Status