Операторы равенства == и === в JavaScript

Если вы читаете этот блог, вы, вероятно, изучаете JavaScript — и это замечательно. Двойное и тройное равно (== и ===) в JavaScript часто заставляют новичков ломать голову. Но пусть вас это не пугает: когда вы узнаете, как работают эти операторы, вы поймете, что такие особенности делают JS еще красивее.

Что такое == и === в JavaScript?

Операторы == и === используются для сравнения и определения степени равенства или идентичности сравниваемых объектов.

И двойное, и тройное равно возвращают true, если сравниваемые объекты равны, а в противном случае возвращают false. Разница между ними в том, что эти операторы используют разные критерии для определения степени равенства.

Учитывая это, давайте на примерах разберемся, чем == отличается от ===.

Как работает оператор == в JavaScript

Двойное равно (==) часто называют «нестрогим равенством», потому что этот оператор выполняет приведение типов перед сравнением.

Это означает, что если типы данных сравниваемых операндов различны, то JavaScript автоматически преобразует один из операндов в тот же тип, что и другой, чтобы их можно было сравнить.

Давайте разберемся с помощью примера.

const a = 100;
const b = '100';

console.log(a == b) // true

Здесь у нас есть две переменные, a и b. Тип переменной a — число, а тип переменной b — строка.

Когда мы сравниваем эти две переменные с помощью двойного равенства, мы получаем на выходе true.

Это происходит потому, что перед сравнением переменная a приводится к строковому типу.

После преобразования значения обеих переменных сравниваются. Если они одинаковы, мы получим true, в противном случае — false. В нашем случае это true.

Важно отметить, что фактическое значение остается неизменным. Оно лишь неявно преобразуется при сравнении.

Правила приведения типов

Рассмотренный пример довольно прост, не так ли? Давайте попробуем еще один, а после разберем правила приведения типов.

const a = true;
const b = 'true';

console.log(a == b)

Итак, как вы думаете, что получится на выходе? Если ваш ответ был true, то, к сожалению, это неверно. Но если вы догадались, что должно получиться false, то поздравляю.

Если ваш ответ был неправильным, не волнуйтесь, потому что сейчас мы познакомимся с несколькими правилами, которые помогут вам разобраться.

Итак, вот правила для приведения типов в JavaScript:

1. Если один из операндов является строкой, то второй операнд будет преобразован в строку.
2. Если один из операндов является числом, другой операнд будет преобразован в число.
3. Если один из операндов является булевым значением, он будет преобразован в число (true станет 1, а false — 0).
4. Если один из операндов является объектом, а другой — примитивным значением, то перед сравнением объект будет преобразован в примитивное значение.
5. Если один из операндов равен null или undefined, то, чтобы при сравнении вернулось true, второй тоже должен быть null или undefined. В противном случае возвращается false.

Теперь, ознакомившись с правилом из пункта 3, вы знаете, почему в приведенном выше примере наш ответ был false.

Значение переменной a (true) перед сравнением преобразуется в число. После этого мы сравниваем 1 и «true» — и получаем false, потому что переменные содержат разные значения.

Как работает оператор === в JavaScript

Тройное равно (===), также называемое «строгим равенством», работает аналогично двойному равно. Но есть важное отличие: при использовании === типы операндов не приводятся перед сравнением.

При сравнении переменных сначала проверяется, отличаются ли их типы. Если да, то возвращается false. Если типы совпадают, то проверяется значение. Если значения одинаковы и не являются числами, возвращается true.

Наконец, если оба операнда — числа и не NaN, и у них одинаковое значение, то возвращается true. В противном случае — false.

Давайте разберемся в этом с помощью примера:

const a = 100;
const b = '100';

console.log(a === b);

Мы взяли тот же пример, что и выше, но при сравнении использовали не двойное, а тройное равенство.

Итак, возможно, вы уже угадали ответ. Да, это false, а почему? Потому что тип переменной a — число, а тип переменной b — строка.

При сравнении тройное равенство сначала проверяет типы операндов, а в данном примере эти типы различаются. Поэтому возвращается false.

Давайте рассмотрим другой пример:

const a = true;
const b = 1;

console.log(a === b);

Здесь у нас тоже две переменные, a и b. Тип переменной a — boolean, а тип переменной b — число. Если мы будем их сравнивать с помощью строго равенства, оно вернет false — потому что, опять же, переменные имеют разные типы.

Заключение

Операторы == и === в JavaScript — это операторы сравнения, которые мы используем, чтобы определить, равны или нет два значения.

Оператор == выполняет нестрогое сравнение, при необходимости преобразуя типы, чтобы сделать сравнение возможным.

Оператор === выполняет строгое сравнение, без приведения типов. При использовании тройного равно сравниваются и типы, и значения.

Преобразование типов в JavaScript иногда может приводить к неожиданным результатам, поэтому чаще всего при сравнении рекомендуется использовать оператор строгого равенства ===.

Перевод статьи «How is == Different from === in JavaScript? Strict vs Loose Equality Explained».

[customscript]techrocks_custom_after_post_html[/customscript]

[customscript]techrocks_custom_script[/customscript]