В чем разница между следующими условиями в TypeScript?

Question

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

В чем разница между двумя условиями? Не было бы так же?

Answer 1

Нет, они абсолютно разные.

!value

это проверяет наличие элемента и не является неопределенным, но ![] and also ![3] это всегда ложно. в основном он проверяет наличие.

и даже [] всегда имеет значение true.

length

вычисляет количество элементов внутри этого массива, и он просто применяется к массиву.

для [] , value.length<1 this returns true.

Answer 2

Быстрый способ понять, что вы не можете получить доступ к свойству length неопределенного массива. Таким образом, второе условие if выдаст ошибку, похожую на Cannot access property 'length' of undefined.

Первое условие if, однако, проверяет, определен ли массив. Так что он не выдаст никакой ошибки.

Typescript содержит собственный способ выполнения этой проверки с использованием «оператора безопасной навигации» или необязательного оператора цепочки ?.. Таким образом, в TS вы можете просто сделать

if (value?.length < 1) { }

Это эквивалентно JS

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

Answer 3

Если value равно null или undefined, вторая if выдаст ошибку, сообщающую, что вы не можете получить доступ к length из null / undefined.

Первый предотвращает это, поскольку он будет иметь доступ к value.length, только если value правдив. В противном случае первое условие (!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.');

В любом случае, это не спецификация c для TS, это просто, как работает vanilla JS.