JavaScript === | Что такое оператор строгого равенства JavaScript?

Как хорошо вы знаете === в JavaScript? Мы расскажем вам все, что вам нужно знать о строгом равенстве в JavaScript, включая примеры, подводные камни и многое другое.

В этой статье я рассмотрю оператор === в JavaScript, также известный как строгое равенство.

Будь вы начинающий программист или опытный специалист по JavaScript, насколько хорошо вы действительно знаете оператор === в JavaScript?

Читайте дальше, чтобы узнать! Я расскажу, что такое оператор === в JavaScript, как им пользоваться, какие подводные камни следует избегать и, конечно же, чем он отличается от своего “родственника” – нестрогого равенства.

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

Кроме того, если учесть то, что Бюро трудоустройства и статистики США сообщает о средней зарплате более $85 тысяч для веб-разработчиков, умение разбираться в операторе === в JavaScript может принести очень хорошую прибыль!

Так что, если вы готовы – давайте начнем и узнаем о JavaScript операторе ===!

Что такое тройное равенство в JavaScript?

Хорошо, предположу, что вы уже знаете основы JavaScript. Если это так, давайте начнем с основ оператора === в JavaScript.

JavaScript оператор === известен как строгий оператор равенства и является основным инструментом для сравнения значений в ваших проектах на JavaScript.

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

Надеюсь, я вас не запутал!

Маленькое отступление, но преобразование типов – это автоматическое или неявное преобразование значений из одного типа данных в другой. Если вы возьмете хорошую книгу по JS, вы обязательно увидите, что это будет упомянуто довольно рано.

Подумайте о преобразовании строки в число при выполнении операций между смешанными типами данных.

Так вот, как я уже сказал, JavaScript === это не выполняет, что означает сравнение как значения, так и типа данных.

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

Это идеально подходит для более точной и надежной проверки равенства, чем с помощью нестрогого равенства.

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

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

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

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

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

Также полезно знать эти детали, если вы собираетесь получить профессиональные сертификаты JavaScript.

В целом, оператор строгого равенства является неотъемлемой частью написания надежного и предсказуемого кода на JavaScript.

Использование === гарантирует, что сравнения точны и аккуратны, что делает наш код более надежным и поддерживаемым в долгосрочной перспективе. Победа!

Как использовать оператор === в JavaScript

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

Не забудьте добавить эти советы в вашу личную шпаргалку по JavaScript!

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

Так что, давайте запустим наши редакторы кода на JavaScript и начнем писать код!

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

Цель проста: если тип и значение идентичны, оператор возвращает true, иначе возвращает false, потому что у нас есть операнды разных типов или значений.

/*CodesCode.io: JavaScript ===Основное использование*/let num = 5;let str = "5";console.log(num === 5); // true, одинаковое значение и типconsole.log(str === "5"); // true, одинаковое значение и типconsole.log(num === str); // false, разные типы

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

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

Вы ожидали увидеть каждый из этих результатов? Особенно, вы ожидали увидеть такой результат при сравнении значения null и undefined?

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

Это полезно знать, если вы привыкли считать оба значения чем-то вроде NaN.

/*CodesCode.io: JavaScript ===Сравнения*/console.log('5' === 5); // false, строка и числоconsole.log(true === 1); // false, булево значение и числоconsole.log(null === undefined); // false, null и undefined

JavaScript === также прекрасно работает с массивами и объектами.

Это очень распространенные типы данных в JavaScript, поэтому давайте посмотрим, как === их сравнивает.

Подсказка: это относится к сравнению ссылок, а не содержимого объектов или массивов.

/*CodesCode.io: JavaScript ===Массивы*/let array1 = [1, 2, 3];let array2 = [1, 2, 3];let array3 = array1;console.log(array1 === array2); // false, разные ссылкиconsole.log(array1 === array3); // true, одна и та же ссылка

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

В результате мы получим значение false. С другой стороны, когда мы создаем array3 и присваиваем ему значение array1, поэтому JavaScript === возвращает true для этого сравнения.

Как вы уже догадались, эти же принципы распространяются и на объекты, как показано ниже.

/*CodesCode.io: JavaScript ===Объекты*/let obj1 = { name: "Alice" };let obj2 = { name: "Alice" };let obj3 = obj1;console.log(obj1 === obj2); // false, разные объектыconsole.log(obj1 === obj3); // true, один и тот же объект

Давайте закончим рассматривать, как использовать строгое равенство в условных операторах.

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

Из-за этого, когда мы сравниваем нашу строковую переменную с числом, JavaScript === возвращает false, и мы входим в ветвь else.

Так что, несмотря на то, что значение переменной age численно равно 18, типы разные (строка против числа), и поэтому условие вычисляется как false.

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

/*CodesCode.io: JavaScript ===Условный оператор*/let age = "18";if (age === 18) {  console.log("Доступ разрешен.");} else {  console.log("Доступ запрещен."); // Этот блок будет выполнен}

Замечательно! Теперь мы узнали, как использовать JavaScript === в некоторых самых распространенных сценариях, хорошая работа!

Ключевой момент, который вам нужно запомнить, состоит в том, что JavaScript === не только сравнивает значения, но и обеспечивает целостность сравниваемых типов.

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

Почему мы используем === вместо ==?

Понимание того, как использовать строгое равенство (===) и нестрогое равенство (==) в JavaScript является фундаментальным для написания точного и безошибочного кода.

Это также распространенный вопрос на собеседовании по JavaScript!

Но вы можете задаться вопросом, почему в JavaScript есть строгое и нестрогое равенство? В чем основное отличие между ними? И почему вы бы использовали одно вместо другого?

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

• Строгое равенство (===) проверяет как значение, так и тип. Если типы отличаются, он возвращает false. Он не выполняет приведение типов.
• Нестрогое равенство (==) сравнивает значения, но перед сравнением приводит операнды к одному типу через приведение типов.

Хорошо, это звучит неплохо, но я думаю, что всегда полезно посмотреть на простой пример кода, чтобы проиллюстрировать разницу.

/*CodesCode.io: JavaScript ===Строгое равенство против нестрогого равенства*/let num = 5;let str = "5";console.log(num === str); // false, так как типы разные (число и строка)console.log(num == str);  // true, так как значение '5' одинаково после приведения типов

В этом примере оператор === возвращает false, потому что одна переменная является числом, а другая – строкой. 

В отличие от этого оператор == возвращает true, потому что строка ‘5’ преобразуется в число перед сравнением.

Но все равно, почему бы не использовать === вместо ==?

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

Поверьте мне, это может вызвать некоторые действительно сложноуловимые ошибки!

Сказано это, есть случаи, когда имеет смысл использовать == вместо ===.

Отличный пример – когда вы получаете данные, но числовые значения несогласованно форматируются как строки или числа.

Это идеальное время для использования нестрогого равенства и приведения типов, а не строгого сравнения чисел.

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

Нестрогое равенство идеально подходит для этого, поскольку вы не захотели бы сравнивать разные типы.

Распространенные ошибки с использованием === в JavaScript

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

Поверьте, они могут вызвать серьезную путаницу, особенно если вы привыкли использовать нестрогое равенство!

Опасность №1: Сравнение разных типов

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

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

/*CodesCode.io: JavaScript === Распространенные ошибкиСравнение разных типов*/let num = 0;let str = "0";// Опасность: Ожидание эквивалентностиconsole.log(num === str); // false, из-за разных типов

Опасность №2: Сравнение объектов и массивов

Еще одно распространенное недопонимание при использовании тройного равенства в JavaScript заключается в ожидании === сравнения содержимого объектов или массивов, а не их ссылок.

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

В этом заключается ключевая разница между использованием === вместо == с массивами и объектами.

/*CodesCode.io: JavaScript === Распространенные ошибкиСравнение массивов*/let array1 = [1, 2, 3];let array2 = [1, 2, 3];// Опасность: Предположение о сравнении содержимогоconsole.log(array1 === array2); // false, разные ссылки

То же самое относится и к объектам.

/*CodesCode.io: JavaScript === Распространенные ошибкиСравнение объектов*/let obj1 = { name: 'Alice' };let obj2 = { name: 'Alice' };// Опасность: Предположение о сравнении свойств объектовconsole.log(obj1 === obj2); // false, разные экземпляры объектов

Опасность №3: Неправильное понимание сравнения null и undefined

Это тонкая, но влиятельная опасность, которая может запутать начинающих. Важно помнить, что хотя null и undefined мягко равны (==), они не являются строго равными.

/*CodesCode.io: JavaScript === Распространенные ошибкиСравнение null и undefined*/// Опасность: Предположение о строгом равенстве null и undefinedconsole.log(null === undefined); // false

Вопросы производительности

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

Это может быть особенно важным в крупномасштабных приложениях, потому что, как мы знаем, когда речь идет о Big-O производительности, все зависит от того, как производительность масштабируется с размером.

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

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

Чистый эффект заключается в том, что при использовании JavaScript ===, движок JavaScript не тратит дополнительные ресурсы на приведение типов, что приводит к более быстрой оценке.

Это особенно заметно внутри плотных циклов или часто вызываемых функций.

Рассмотрите этот пример в контексте цикла, как я показал ниже.

/*CodesCode.io: JavaScript ===Performance Considerations*/for (let i = 0; i < largeArray.length; i++) {  if (largeArray[i] === targetValue) {      // Perform action  }}

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

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

Тем не менее, я также скажу, что в повседневных сценариях написания кода, разница в производительности в основном минимальна!

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

В большинстве случаев преимущества более чистого и предсказуемого кода с === перевешивают его преимущества в производительности, но их также приятно иметь!

Заключение

Вот и все, вы теперь знаете все, что нужно знать о операторе JavaScript ===.

Вы узнали что-то новое? Надеюсь так!

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

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

Надеюсь, вам понравилось это исследование одного из наиболее распространенных инструментов в языке JavaScript, и не стесняйтесь оставлять комментарии ниже!

Счастливого кодирования!

Вы новичок в JavaScript и хотите узнать больше об этом популярном языке программирования? Ознакомьтесь с:

Часто задаваемые вопросы

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

В JavaScript === – это оператор строгого равенства, который сравнивает значение и тип без приведения типов, в то время как == – нестрогий оператор равенства, и он сравнивает значения с приведением типов.

2. Зачем использовать === вместо == в JavaScript?

Часто лучше использовать === вместо ==, потому что он обеспечивает более точное и предсказуемое сравнение, проверяя одновременно и значение, и тип. Это также помогает избежать ошибок из-за неявного преобразования типов.

---

• JavaScript