TypeScript 中的以下条件有什么区别？

Question

if (!value || value.length<1) 
if (value.length<1)

这两种情况有什么区别？不一样吗？

Answer 1

如果 value 是 null 或 undefined，第二个 if 将抛出一个错误，说明您无法访问 length of null / undefined.

第一个阻止了这种情况，因为它只会在 value 为真时访问 value.length。否则，满足第一个条件 (!value)，因此甚至不会评估第二个条件 (value.length < 1)。

const arr1 = null;
const arr2 = [];

// Satisfies first condition:
if (!arr1 || arr1.length < 1) console.log('No values in arr1.');

// Satisfies second condition:
if (!arr2 || arr2.length < 1) console.log('No values in arr2.');

// Breaks:
if (arr1.length < 1) console.log('No values in arr1.');

无论如何，这不是 TS 特有的，这就是 vanilla JS 的工作方式。

Answer 2

不，它们完全不同。

!value

这会检查一个项目是否存在并且它不是未定义的，但是 ![] and also ![3] 这总是错误的。基本上它会检查是否存在。

甚至 [] 总是正确的。

length

计算该数组中元素的数量，它纯粹应用于数组。

对于[] , value.length<1 this returns true.

Answer 3

快速理解的方法是您无法访问未定义数组的 length 属性。所以第二个 if 条件将抛出类似于 Cannot access property 'length' of undefined.

的错误

然而，第一个 if 条件检查数组是否已定义。所以它不会抛出任何错误。

Typescript 包含使用 "safe navigation operator" 或 optional chaining operator ?. 进行此检查的本机方法。所以在 TS 中，你可以简单地做

if (value?.length < 1) { }

相当于JS

if ((value === null || value === void 0 ? void 0 : value.length) < 1) { }

TypeScript 中的以下条件有什么区别？

Whats the difference between the following conditions in TypeScript?

javascript

arrays

conditional-statements

truthiness

typescript