javascript - Typescript - 内联未定义检查不起作用(对象可能是 'undefined' .ts(2532))

Question

我收到以下 typescript 错误:

const myFunction = (
  param1: string | undefined,
  param2: { someProp: string } | undefined
) => {
  if (!param1 && !param2) {
    return;
  }

  // Here I get the following Typescript error:
  //  (parameter) param2: { someProp: string } | undefined
  //  Object is possibly 'undefined'.ts(2532)
  const param3 = param1 ? param1 : param2.someProp;
};

以下作品:

const param4 = param1 ? param1 : param2 ? param2.someProp : null;

但两次检查 null 或 undefined 似乎是多余的。

我必须提到，compilerOptions 中的 strictNullChecks 选项设置为 true，并且希望保持这样。

知道为什么我会收到此错误吗？

这是一个 CodeSandbox，其代码为:https://codesandbox.io/s/jn2mp01q2v

Answer 1

关于 TypeScript 编译器的可悲事实是，它并不像人类那么聪明(无论如何从 TypeScript 3.4 开始)，因此它的 control flow analysis只不过是您可以自己执行的那种分析的苍白影子。当然，它的分析非常一致，而我的分析在我最近没有吃饭时往往会变得更糟。

如果您对联合类型的变量执行检查，完全消除了该联合的一个或多个组成部分，编译器将很乐意为您缩小变量的类型:

param1.charAt(0); // error, possibly undefined
if (!param1) return;
param1.charAt(0); // okay now

但是编译器没有做的一件事是跟踪 correlated variables discriminated unions 之外。您通过检查消除了哪些内容

if (!param1 && !param2) return;

有可能 param1和param2可以是undefined同时。您已经采用了两个先前的自变量，并使它们彼此相关。编译器不会跟踪哪些内容。自 param1和param2两者仍然可以是 undefined (只是不同时)，编译器将它们视为仍然独立，并且您将面临问题。

您可以按照其他答案的建议进行操作并使用 type assertion ，这适用于您比编译器更聪明并且不想尝试引导编译器完成理解您已知内容的任务的情况:

const param3 = param1 ? param1 : param2!.someProp; // I'm smarter than the compiler 🤓

请注意，我使用了 non-null assertion operator !这可能是证明你优于机器的最简洁的方式。另请注意，此类断言并不安全，因为您可能误解自己的优越性。因此，只有在你仔细检查了 param2 没有办法之后，才可以做这样的事情。成为undefined .

<小时/>

您可以做的另一件事是重构代码，以便引导编译器进行它可以进行的分析。

const param3 = param1 || (param2 ? param2.someProp : undefined);
if (!param3) return;
param3.charAt(0); // string

这对您有用，您只需检查每个参数一次。变量param3类型为string | undefined ，并且只有 undefined如果两者param1和param2是虚假的。该代码中的每个步骤都完全消除了每个变量的联合成分，而不会留下任何相关类型来混淆编译器。

任一解决方案都适合您。希望有帮助；祝你好运!