可选链接打字稿上的对象可能是“未定义”错误

问题描述

我正在访问一个响应：data?.currentOrganization?.onboardingSteps?。您可以猜到，data、currentOrganization 和 onboardingSteps 可能都为 null。我想按如下方式分配一个变量：

const hassteps = data?.currentOrganization?.onboardingSteps?.length > 0;

我认为如果任何字段为空或少于 1 个步骤，hasValue 将评估为 false。但是，我收到了 TypeScript 错误：Object is possibly 'undefined'。

这就是我目前解决它的方式：

const hassteps =
  data?.currentOrganization?.onboardingSteps != null &&
  data?.currentOrganization?.onboardingSteps?.length > 0;

这感觉不必要地冗长。有没有其他更优雅的解决方案？

解决方法

optional chain 最终会为 data?.currentOrganization?.onboardingSteps?.length 生成一个值，如果链中的所有内容都不是 number 或 null，则该值可能是 undefined。 .. 但如果链中的任何内容都是无效的，那么输出将是 undefined 本身。如果没有 Typescript 抱怨，您就无法测试 undefined > 0。

因此，您可能应该执行以下操作：

const hasSteps = (data?.currentOrganization?.onboardingSteps?.length ?? 0) > 0;

如果可选链以 0 结尾，则使用 nullish coalescing 生成 undefined。

Playground link to code