Помните те загадочные моменты, когда вы были по колено в отладке кода, ломая голову над тем, почему одни значения ведут себя загадочно, а другие — просто и понятно? Иногда, в ситуациях, когда вы пытались написать простое выражение «если», ожидая, что оно сработает как волшебство, но оно в конечном итоге приводило вас в полное замешательство.
Возможно, вы задавались вопросом, почему ненулевое число оценивалось как «истина», а пустая строка каким-то образом оказывалась «ложью».
Итак, позвольте представить вам скрытый мир Истинных и Ложныхценностей! Представьте их как ответчиков «да» и «нет» в вашем коде, принимающих решения за кулисами, которые могут заставить вас задаться вопросом: «Почему это произошло?»
Правдивые значения в простом английском языке подобны «истинным» логическим значениям, они делают шаг вперед, провозглашая «Да, я прав!» всякий раз, когда встречаются с оператором «если» или любым другим условием, требующим логическое значение.
С другой стороны, значения Falsy подобны логическому значению «false», быстро утверждая: «Нет, я ложный!», когда этого требует код.
Вот значения True и Falsy, которые вы должны знать
Оценка истинных и ложных значений с помощью условий
Пример 1
Допустим, у нас есть веб-форма, запрашивающая, сколько у вас детей, и вы хотите проверить форму, поэтому мы используем
const children = 3; if(children){ console.log(`You have ${children} children`);//You have 3 children } else { console.log(`Please enter number of children`) }
Из приведенных выше значений 3 является истинным значением, поэтому мы получаем вывод «У вас 3 детей»
Если мы изменим значение детей на 0,
const children = 0; if(children){ console.log(`You have ${children} children`); } else { console.log(`Please enter number of children`)//Please enter number of children }
Мы изменили значение на 0, что является ложным значением, поэтому вывод на консоли будет выглядеть так: «Пожалуйста, введите количество детей».
Вы можете видеть, насколько это может быть проблемой, тем более что вам нужно будет заполнить это поле, чтобы двигаться вперед, поэтому в этом случае вы можете сделать ноль истинным значением:
const children = 0; if (!isNaN(children)) { console.log(`You have ${children} children`);//You have 0 children } else { console.log(`Please enter number of children`) }
Оператор if проверяет, не является ли значение children
NaN. Функция isNaN()
приводит значение children
к числу, и в данном случае это уже число (0). Поскольку 0 является допустимым числом, условие оценивается как false
(!false
становится true
), и код внутри блока if будет выполнен.
Пример 2
Проверка на наличие пустых массивов
const posts = []; if (posts) { console.log('List Posts');//List Posts } else { console.log('No Posts To List'); }
Как упоминалось ранее, массивы в JavaScript всегда правдивы, даже если они пусты. Таким образом, условие «если» всегда будет оцениваться как true
, и код всегда будет регистрировать «Список сообщений» в консоли, указывая, что есть сообщения, которые нужно перечислить.
Однако, если вы используете свойство .length
в массиве, как это…
const posts = []; if (posts.length > 0) { console.log('List Posts'); } else { console.log('No posts to list');//No posts to list }
Оценивая условие posts.length > 0
, код определяет, есть ли какие-либо записи для перечисления. Поскольку массив posts
пуст, условие оценивается как false
, и в консоли отображается сообщение «Нет сообщений в списке».
Пример 3
Проверка на наличие пустых объектов
const user = {}; if (user) { console.log('List User'); } else { console.log('No User'); }
Объекты, как и массивы, также всегда правдивы в JavaScript, даже если они пусты. Таким образом, условие «если» всегда будет оцениваться как true
, и код всегда будет регистрировать «Список сообщений» в консоли, указывая, что есть сообщения, которые нужно перечислить.
Чтобы изменить это, вам нужно проверить, содержит ли объект с именем user
какие-либо свойства, используя метод Object.keys()
.
const user = {}; if (Object.keys(user).length > 0) { console.log('List User'); } else { console.log('No User');//No User }
Метод Object.keys()
используется для извлечения массива ключей из объекта user
. Метод Object.keys()
возвращает массив, содержащий все перечисляемые имена свойств объекта. Если объект user
не имеет свойств (т. е. это пустой объект), Object.keys()
вернет пустой массив с длиной 0, что в этом случае приведет к «Нет пользователя».
Если у объекта есть свойства, возвращаемый массив будет иметь длину больше 0, что приведет к «Списку пользователей».
Вот некоторые ресурсы, которые я нашел полезными
- https://sentry.io/answers/truthy-and-falsy-values-in-javascript/
- https://medium.com/swlh/what-are-truthy-and-falsy-values-in-javascript-21f117442c58
- https://www.youtube.com/watch?v=Xp60QbXRAPI
- https://www.youtube.com/watch?v=5DVqAFhfSsE
Продолжая свое путешествие по JavaScript, имейте в виду, что концепция значений Truthy и Falsy — это не просто любопытство, а основополагающий аспект языка. Примите силу этих, казалось бы, странных поведений, и они станут вашими надежными спутниками, помогая вам писать более чистый и эффективный код.