В этом уроке описаны операторы сравнения. Эти операторы (такие как «меньше» <, «больше» >, «меньше или равно» <= и т.д.) проверяют равенство или неравенство операндов и возвращают в качестве результата значение true или false в зависимости от того, как соотносятся операнды.

Операторы сравнения позволяют сравнивать два значения между собой и, если условие выполнено, возвращают true, а если нет — false.

Выражения сравнения всегда возвращают логические значения, которые широко применяются в инструкциях if, while или for для управления ходом исполнения программы.

Полный список операторов сравнения в JavaScript приведен в следующей таблице:

ОператорОписаниеПримерРезультат
==Равно10 == 20false
===Строго равно (идентичность)"20" === 20false
!=Не равно10 != 20true
!==Строго не равно20! == 20false
>Больше чем20 > 10true
>=Больше или равно20 >= 10true
<Меньше чем20 < 10false
<=Меньше или равно20 <= 10false

Оба оператора принимают операнды любого типа и, если операнды равны, оператор равенства == возвращает true, а оператор неравенства != возвращает – false.

Получив операнды разных типов, эти операторы пытаются привести их к одному типу и сравнивают уже преобразованные значения.

При преобразовании типов операторы равенства == и неравенства != руководствуется следующими правилами:

  • Если какой-либо операнд число или булево значение, то операнды преобразуются в числа, при этом true преобразуется в 1, а false преобразуется в 0.
  • Если какой-либо операнд строка – второй преобразуются в строку.
  • Если одно из значений представляет собой объект, а другое – число или строку, то объект преобразуется в элементарный тип.

При сравнении операндов также применяются свои правила:

  • Если одно из значений равно null, а другое – undefined, то они равны.
  • Значения null и undefined не преобразуются для сравнения ни в какие другие значения.
  • Значение NaN считается не равным никакому другому значению, включая само себя. При его наличии оператор равенства всегда возвращает false, а оператор неравенства – true.
  • Если оба операнда являются объектами, то они сравниваются, чтобы выяснить, один ли это объект. Если да, возвращается true, иначе – false.

Примеры:

Выполнить код »

Примечание: Значения null и undefined равны == друг другу и не равны ничему другому.

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

Оператор идентичности === возвращает true, только если операнды равны без преобразования:

  • Если оба операнда имеют примитивные типы и содержат одинаковые значения, они считаются равными.
  • Два операнда считаются равными, если оба ссылаются на один и тот же объект. Если же они ссылаются на разные объекты, они не равны, даже если эти объекты имеют идентичные свойства.
  • Оператор идентичности считает значение NaN не равным никакому другому значению, включая само себя. При его наличии оператор идентичности всегда возвращает false.

В противоположность оператору идентичности === оператор неидентичности !== возвращает true, если без преобразования операнды не равны.

Выполнить код »

На заметку: Выражение null == undefined истинно, потому что значения равны, но null === undefined ложно, потому что типы этих значений разные.

Как работают операторы отношений «больше» >, «меньше» <, «больше или равно» >= и «меньше или равно» <= нам известно ещё из школьной математики. Каждый из этих операторов возвращает логическое значение (true или false).

Оператор больше > возвращает true, если значение левого операнда больше, чем значение правого операнда, в противном случае он возвращает false:

alert(7 > 5); // true
alert(5 > 7); // false

Оператор меньше < возвращает true, если значение левого операнда меньше, чем значение правого операнда, в противном случае он возвращает false:

alert(7 < 5); // true
alert(5 < 7); // false

Оператор больше или равно >= возвращает true, если значение левого операнда больше или равно, чем значение правого операнда, в противном случае он возвращает false:

alert(7 >= 5); // true
alert(5 >= 5); // true

Оператор меньше или равно <= возвращает true, если значение левого операнда меньше или равно, чем значение правого операнда, в противном случае он возвращает false:

alert(5 <= 7); // true
alert(5 <= 5); // true

Если оператор отношения применяется к двум строкам, то сравнение происходит побуквенно/посимвольно. То есть сравнение происходит так: каждый символ (буква) первой строки сравнивается с соответствующим символом второй строки и так, до того момента, пока символы не будут разными, и тогда какой символ больше – та строка и больше. Если же в одной из строк закончились символы, то считаем, что она меньше, а если закончились в обеих – строки равны.

Теперь разберем, как происходит сравнение каждого символа. Каждый символ переводится в числовое значение, согласно кодировке Unicode, и суть сравнения символов сводиться к сравнению двух чисел. Например, десятичные (Dec) значения символов кирилицы лежат в диапазоне от 1024 до 1280.

Пример:

var str1 = "Апельсин";
var str2 = "абрикос";

Начинаем сравнивать первые символы: str1[0] (буква "А") и str2[0] (буква "а").

В JavaScript, как и в других языках програмирования, есть метод для получения цифрового кода из символа:

str.charCodeAt(pos);

Метод возвращает код символа расположенного на позиции pos в строке str. Отсчет позиций символов в строке начинается с нуля.

Выполнить код »

Если бы первые символы строк были равны, то дальше сравнивались бы следующие символы попарно.

В этом примере строка "Апельсин" считается меньше, чем строка "абрикос", потому что буква "А" имеет код 1040, а буква "а"1072. Причина в том, что коды прописных букв всегда меньше, чем строчных.

Чтобы правильно сравнить строки по алфавиту, необходимо перед сравнением преобразовать оба операнда в один регистр (например, в нижний):

Выполнить код »

После преобразования в нижний регистр слово "апельсин" становится больше, чем слово "абрикос", потому что вторая буква "п" имеет код 1087, а вторая буква "б" переменной str21073.

Примечание: Обычно, буква расположенная в алфавитном порядке раньше имеет меньший числовой код, чем буква (в том же регистре) расположенная в алфавитном порядке после неё.

Не менее интересная ситуация складывается при сравнении чисел, предствленных в строковой форме, например:

Выполнить код »

В примере выше "15" < "5", потому что числа, представленные в виде строк, сравниваются как строки. Строковые операнды, как вы уже знаете, сравниваются по кодам знаков (код знака "1" – 49, код знака "5" – 53 ).

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

Выполнить код »

В этом примере строка "15" преобразуется в число 15, а затем производится сравнение полученных чисел.

На заметку: Когда строка сравнивается с числом, она преобразуется в число и выполняется числовое сравнение операндов.

В случае, когда строку невозможно преобразовать в число, она преобразуется в NaN. Как правило, в результате любой операции сравнения с операндом NaN получается false:

Выполнить код »
  • Операторы сравнения сравнивают значения операндов и возвращают логическое значение – true или false в зависимости от результатов проверки.
  • При сравнении операнды, имеющие значения разных типов, приводятся к числовому значению, за исключением сравнения на идентичность === и неидентичность !==.
  • При сравнении строк, сравнение происходит побуквенно: каждый символ переводится в числовое значение, согласно кодировке Unicode, и суть сравнения символов сводиться к сравнению двух чисел.
  • Код буквы в нижнем регистре всегда больше, чем код буквы в верхнем регистре.
  • Код цифры находящейся в строке всегда меньше кода буквенного символа в любом регистре.
  • Как правило, код буквы, расположенной в алфавитном порядке раньше имеет меньшее значение, чем код буквы (в том же регистре), расположенной в алфавитном порядке после неё.
  • Операторы сравнения считают значение NaN не равным никакому другому значению, включая само себя.
  • Значения null и undefined НЕ СТРОГО равны == друг другу.
  • При преобразовании в число null становится 0, а undefined становится NaN.

  • Выберите правильный оператор сравнения между двумя выражениями, чтобы отобразить «true»:

    var a = "" + 1 + 0;
    var b = 9;
    alert( a /*оператор сравнения*/ b ); // true
    
    Показать решение

    Решение:

    После сложения значением переменной a станет строка "10". При сравнении с числом строка "10" будет преобразована в число 10. Ответ: «больше» (>) или «больше или равно» (>=).

    Выполнить код »
  • Выберите правильный оператор сравнения между двумя выражениями, чтобы отобразить «false»:

    var a = "" - 1 + 0;
    var b = true + false;
    
    alert( a /*оператор сравнения*/ b ); // false
    
    Показать решение

    Решение:

    После сложения значением переменной a станет число (-1), а значением переменной b – число (1). Ответ: «больше» (>), «равно» (==), «идентично» (===) или «больше или равно» (>=).

    Выполнить код »
  • Какой результат будет у выражений ниже: true или false?

    alert( ("2" * "3") > (9 / "3") ); 
    alert( ("4" * 2) == ("4px" * 2) );
    alert( ("4" - 2) == ("4px" - 2) );
    
    Показать решение

    Решение:

    Так как умножение, деление и вычетание производятся только с числами, JavaScript превращает строку в число, если это возможно. В противном случае, результат — NaN. Первое выражение: 6 > 3 // true. Второе выражение: 8 == NaN // false. Третье выражение: 2 == NaN // false.

    Выполнить код »
  • Верны ли следующие выражения? Почему?

    null + 1 == 1 // true
    undefined + 1 == NaN // false
    null == "0" // false
    +null == +"0" // true
    
    Показать решение

    Решение:

    При преобразовании в число null становится 0, а undefined становится NaN. Поэтому с первыми двумя выражениями всё понятно: 1 == 1 // true; NaN == NaN // false, т.к. значение NaN не равно никакому другому значению, включая само себя. В третьем выражении null сравнивается со строкой "0". В четвертом выражении унарный плюс преобразует операнды в числа, поэтому null сравнивается с числом 0.

    Выполнить код »

Комментарии

пожелания к комментариям…
  • Приветствуются комментарии, соответствующие теме урока: вопросы, ответы, предложения.
  • Одну строчку кода оборачивайте в тег <code>, несколько строчек кода — в теги <pre><code>...ваш код...</code></pre>.
  • Допускаются ссылки на онлайн-песочницы (codepen, plnkr, JSBin и др.).