Оператор ! (логічне НЕ)

JavaScriptJunior~2 хв читання

Оператор ! називається логічним запереченням (NOT) і інвертує логічне значення виразу. Він спочатку приводить операнд до типу boolean, а потім перевертає результат, тому повертає завжди рівно true або false, незалежно від типу вхідного значення.

Теорія

TL;DR

!true дає false, !false дає true.
Якщо значення truthy (істинне), результат буде false; якщо falsy (хибне), результат буде true.
Falsy значень лише вісім: false, 0, -0, 0n, '', null, undefined, NaN. Усе інше truthy.
[] і {} це об'єкти, а отже truthy: ![] і !{} дають false.
!!value це ідіома явного приведення будь-якого значення до boolean.
Результат ! завжди має тип boolean, тому оператор зручний у перевірках if (!user).

Швидкий приклад

javascript

const isLoggedIn = false;

if (!isLoggedIn) {
  // !false стає true, тому блок виконається
  console.log('Користувач не авторизований');
}

const input = '';
console.log(!input);   // true  (порожній рядок falsy)
console.log(!!input);  // false (те саме значення як boolean)

Правило та поведінка з різними типами

Правило коротке:

javascript

!true  // false
!false // true

Якщо значення істинне (truthy), воно стане false. Якщо значення хибне (falsy), воно стане true.

Повний набір прикладів для значень різних типів:

javascript

!true            // false
!false           // true
!0               // true   (0 це хибне значення)
!1               // false  (1 це істинне значення)
!""              // true   (порожній рядок це хибне значення)
!"hello"         // false  (непорожній рядок це істинне значення)
!undefined       // true
!null            // true
!NaN             // true
![]              // false  (масив це truthy)
!{}              // false  (об'єкт це truthy)

Зверніть увагу на два останні рядки: порожній масив і порожній об'єкт не є falsy, бо це посилання на об'єкти. Перевіряти «порожнечу» треба явно, наприклад через arr.length === 0.

Подвійне заперечення `!!`

Дуже часто в JavaScript трапляється подвійний оператор:

javascript

!!value

Він використовується для приведення будь-якого значення до типу boolean: перше ! інвертує, друге повертає назад, і на виході залишається чистий логічний тип.

javascript

!!'hello'   // true
!!''        // false
!!0         // false
!!123       // true
!!null      // false
!!{}        // true
!![]        // true

!! це короткий і зрозумілий спосіб явно сказати: «Перетвори значення на булеве».

Той самий результат дає виклик Boolean(value), і в коді, який читають інші, він часто зрозуміліший. !! лишається популярним через стислість.

Використання в логічних виразах

! найчастіше зустрічається у перевірках умов:

javascript

const isLoggedIn = false;

if (!isLoggedIn) {
  console.log('Користувач не авторизований');
}

Тут !isLoggedIn дає !false, тобто true, отже блок if виконається.

Так само зручно перевіряти відсутність даних: if (!user), if (!items.length), if (!response.ok).

Як це працює всередині

JavaScript спочатку приводить значення до логічного типу (true або false).
Потім інвертує отриманий результат.

Приклад:

javascript

!'text'   // крок 1: 'text' стає true; крок 2: !true стає false

Саме тому ! ніколи не повертає вихідне значення: на відміну від && і ||, які повертають один з операндів, ! завжди віддає новий boolean.

Порівняння з іншими логічними операторами

Оператор	Назва	Приклад	Результат
`!`	Логічне НЕ	`!true`	`false`
`&&`	Логічне І	`true && false`	`false`
`\|\|`	Логічне АБО	`true \|\| false`	`true`

Підсумкова таблиця за сценаріями використання:

Ситуація	Що робить `!`	Приклад
Заперечує логічне значення	Інвертує `boolean`	`!true` дає `false`
Приводить значення до `boolean`	Подвійне `!!`	`!!'js'` дає `true`
Використовується в умовах	Перевірка відсутності	`if (!user)`, тобто «якщо user не заданий»

Типові помилки

Вважати, що ![] або !{} дають true. Масив і об'єкт це truthy, тому результат false; порожнечу перевіряйте через length або Object.keys().
Плутати ! з && і ||: останні повертають один з операндів, а ! завжди повертає boolean.
Забувати, що !'0' дає false: рядок '0' непорожній, а отже truthy, хоча число 0 є falsy.
Використовувати !! там, де значення вже логічне; подвійне заперечення потрібне лише для приведення типу.
Писати if (!x), коли треба відрізнити 0 або '' від null/undefined. Для цього краще if (x == null) або x ?? fallback.
Плутати логічне ! з != та !==: це різні оператори, і пробіл чи знак рівності повністю змінюють зміст виразу.

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.