为什么 typescript 会在一个数字上抛出错误 | 未定义的比较，即使在使用可选链接之后？

Question

Below is the code block that I have where typescript will throw an error on the second if saying that Object may be undefined, in that case, shouldn't typescript just assume that as false when a is undefined and not throw an error?

const condition = true; // can be a condition that could be either true or false
const a: Array<number> | undefined;
if(condition) {
    a = [1,2,3,4,5];
}

if(a?.length > 0){
   // Have some code
}
   

Here is a link to the code block and the error being thrown. https://www.typescriptlang.org/play?#code/MYewdgzgLgBKYBMCWUngFwCMQgDYFMBDMGAXhigCcBXfAbgFgAoA2Q9GAQUssIE8APGGoBbTPkoA+GAB8Y1RPgBmSMPgSMmSJQAp4yVOACUMAN7MYMQmRgBtAIwAaAEyOAzI4AsAXU0BfZmZtHUIAfgA6AjAAcygACxhpAAYTcyZLAHoMmAAJQgA3fBgIEBEi0AR8Zj8gA

Or is that we are trying to do an undefined > 0 undefined comparison to a number, that is the reason it throws an error?

Answer 1

Or is that we are trying to do an undefined > 0 undefined comparison to a number, that is the reason it throws an error?

That's exactly it. For another example that results in the exact same error, see:

const undef = void 0;
if (undef > 0) {
  // Have some code
}

Nothing to do with your Array<number> | undefinedArray<number> | undefined in particular or the optional chaining - it's that TypeScript won't let you compare something that might not be defined against a number, because the comparison doesn't make much sense. In such a case, where the array isn't defined, would you expect

if (a?.length > 0) {

to be fulfilled, or not? Or are you not entirely sure? If you're unsure, as many people probably would be without first running the code to see what it results in, that's the point behind this TypeScript error - the code is confusing, so TS is prompting you to fix it.