Learn JavaScript

Сравнения в JavaScript: === и ==, >, <, >=, <=

Операторы сравнения возвращают логическое значение true или false. Они используются в условиях (if), циклах, фильтрации массивов и в любой логике, где нужно сравнить значения.

Основные операторы

Равенство и неравенство

  • === строгое равенство
  • !== строгое неравенство
  • == нестрогое равенство
  • != нестрогое неравенство

Сравнение по порядку

  • > больше
  • < меньше
  • >= больше или равно
  • <= меньше или равно
console.log(5 > 3);     // true
console.log(5 <= 5);    // true
console.log(10 !== 7);  // true

=== vs ==: в чем разница

Строгое равенство ===

=== сравнивает значения без преобразования типов. Совпасть должны и тип, и значение.

console.log(5 === 5);       // true
console.log(5 === "5");     // false
console.log(false === 0);   // false
console.log(null === undefined); // false

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

Нестрогое равенство ==

== перед сравнением может приводить значения к одному типу (неявное преобразование типов). Из-за этого результат иногда выглядит неожиданно.

console.log(5 == "5");   // true  ("5" -> 5)
console.log(false == 0); // true  (false -> 0)
console.log("" == 0);    // true  ("" -> 0)

Самый известный пример:

console.log(null == undefined);  // true
console.log(null === undefined); // false

Если нужно избежать сюрпризов, лучше выбирать === и !==.

Как работает сравнение >, <, >=, <=

Для чисел все прямолинейно:

console.log(10 > 2);     // true
console.log(10 < 2);     // false
console.log(10 >= 10);   // true

Но если один из операндов не число, JavaScript может выполнить преобразование типов.

console.log("10" > 2);   // true  ("10" -> 10)
console.log("2" < 10);   // true  ("2" -> 2)

Сравнение строк

Если сравниваются две строки, используется лексикографический порядок (по кодам символов, с нюансами регистра).

console.log("a" < "b");    // true
console.log("ab" < "ac");  // true
console.log("Z" < "a");    // true

Важный нюанс:

console.log("9" > "10"); // true (сравнение строк: "9" идет после "1")

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

console.log(Number("9") > Number("10")); // false

Особые случаи и нюансы

NaN

NaN не равен ничему, включая самого себя.

console.log(NaN === NaN); // false
console.log(NaN == NaN);  // false

Проверка NaN:

console.log(Number.isNaN(NaN));           // true
console.log(Number.isNaN("not a number"));// false
console.log(Number.isNaN(Number("x")));   // true

-0 и 0

В большинстве сравнений -0 и 0 считаются равными:

console.log(0 === -0); // true
console.log(0 == -0);  // true

Если нужно различать -0 и 0, подходит Object.is:

console.log(Object.is(0, -0));   // false
console.log(Object.is(NaN, NaN)); // true

null и undefined в сравнениях по порядку

null и undefined ведут себя по-разному в == и в > < >= <=.

console.log(null == undefined); // true

console.log(null > 0);   // false
console.log(null >= 0);  // true  (null -> 0)
console.log(null == 0);  // false

console.log(undefined > 0);  // false
console.log(undefined >= 0); // false
console.log(undefined == 0); // false

Если возможны null/undefined, лучше проверять их явно, а не полагаться на правила преобразования.

Сравнение объектов

Объекты сравниваются по ссылке, а не по содержимому.

console.log({} === {}); // false

const a = { value: 1 };
const b = a;

console.log(a === b); // true (одна и та же ссылка)

То же относится к массивам:

console.log([1, 2] === [1, 2]); // false

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

Что стоит запомнить

  • Для равенства по умолчанию используются === и !==.
  • == и != могут приводить типы и давать неожиданные результаты.
  • > < >= <= для строк работают как лексикографическое сравнение.
  • NaN не равен самому себе, для проверки используется Number.isNaN.
  • Объекты и массивы сравниваются по ссылке.