Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Оператор ! (логічне НЕ)». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

**Оператор `!` називається логічним запереченням (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)`.

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

Приклад:

```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`.
- Плутати логічне `!` з `!=` та `!==`: це різні оператори, і пробіл чи знак рівності повністю змінюють зміст виразу.

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати717 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.