Стать программистом. Часть 13. Основы JavaScript для абсолютных новичков!
Доброе время суток, друзья!
В прошлом уроке мы с Вами знакомились с операторами присваивания. Мы рассмотрели на практике основные из них. Привели примеры и познакомились с тем, как работает неявное преобразование типов в работе с этими операторами, а также рассмотрели основные алгоритмы, которые призваны помочь нам в вычислении результатов операций с этими операторами. В конце предыдущего урока была дана задача. Если у кого-то возникли вопросы с ее выполнением - пишите в комментариях я помогу разобраться.
В сегодняшнем уроке мы рассмотри еще одни операторы для взаимодействия между переменными.
Эти операторы, как и предыдущие занимает достаточно большое поле использования в JavaScript. Они носят название - Comparison Operators или Операторы сравнения. Сама тема достаточно обширная, но все-таки мы постараемся полностью рассмотреть ее в этом уроке.
Операторы сравнения часто идут бок о бок с логическими операторами, которые мы рассматривали в одном из наших предыдущих уроков.
Но давайте обо всем по порядку. Итак, начнем
УРОК 13. Другие возможные взаимодействия между переменными. Операторы сравнения.
В своем кодовом представлении операторы сравнении чем-то напоминаю операторы присвоения. Однако это, пожалуй, и все, чем они между собой схожи.
Вот список операторов сравнения, которые мы будем рассматривать:
- == (Равно).
- === (Строго равно).
- != (Не равно).
- !== (Строго не равно).
- > (Больше ).
- >= (Больше или равно).
- < (Меньше).
- <= (Меньше или равно).
Результатом операций с участием операторов сравнения всегда будет одно из двух возможных булевских значений. Другими словами, не важно какой из операторов сравнения используется в данный момент, результатом его работы всегда будет либо true либо false.
Оператор == (Равно).
Этот оператор сравнивает значения участников операции возвращает true в случае если все участники равны между собой и false - в случае, когда какой-либо из участников по своему значению отличается.
В случае, когда участники операции одного типа, оператор == просто сравнивает их значения, в противном случае, все участники при помощи неявного преобразования приводится к одинаковому типу и затем сравниваются.
Если значения переменных равны изначально или равны после неявного приведения типов вернет true. Если значения не равны - вернет false. Давайте рассмотрим на примере:
// переменные одного типа
var a = 1;
var b = 2;
// переменные разных типов
var c = 'привет';
var d = true;
var e = null;
alert(a == b);
alert(c == a);
alert(d == b);
alert(e == a);
Разберем:
В записи alert(a == b);
обе переменные имеют одинаковый тип - Number, значит неявного преобразования здесь не будет. Если подставим вместо переменных их значения, то получим alert(1 == 2)
. Зададим себе вопрос: "1 больше чем 2?" Очевидно, что нет. Значит результатом такой операции будет значение false.
В записи alert(c == a);
переменные имеют разный тип (String и Number). Значит будет попытка преобразования типа переменных. Однако из прошлых уроков мы знаем, что строку где нет цифирного значения JavaScript не может преобразовать в число. Зато может это сделать с цифрой 1 преобразовав ее в строку '1'. Но даже в этом случае сравнение 'привет' == '1'
будет ложным, так как эти строки явно неодинаковые, а значит и не равны. Результат false.
В записи alert(d == b);
так же учувствуют две переменных разного типа Boolean и number. Неявное преобразование имеет место быть. В своих значениях запись выглядит как alert(true == 2);
. Из предыдущих уроков мы помним ассоциации, поэтому итоговое сравнение будет происходить между 1 == 2;
, которые равны быть не могут. Результат false.
Задача:
Используя логику описанную выше, разберите последнюю запись примера alert(e == a);
и проверьте ее результат в браузере.
Оператор === (Строго равно).
В случае, когда сравниваются переменные одного типа, оператор === будет работать точно так же, как и его предшественник - ==. Однако, в случае работы с переменными разного типа оператор строго равно === не даст JavaScript'у использовать свою способность неявного преобразования, по той причине, что данный оператор сравнивает не только значения переменных, но и их типы. Соответственно если типы не равны - это уже будет сигналом для оператора что результатом сравнения должен быть false.
Если значения и типы переменных равны вернет true. Если значения или тип, или и то и то не равны - вернет false. Пример:
// переменные одного типа
var a = 1;
var b = 1;
// переменные разных типов
var c = 'привет';
var d = true;
var e = null;
alert(a === b);
alert(c === a);
alert(d === b);
alert(e === a);
Разберем:
Запись alert(a === b);
. Обе переменные имеют тип Number. При подстановке значений будет иметь вид 1 === 1
. То есть оба главных критерия выполнились (и типы одинаковые и значения равны). Результат true.
Запись alert(c === a);
. В этой записи сравнивается переменная с типом String и переменная с типом Number. Сразу false. Критерий одинаковых типов не выполняется.
Запись alert(d === b);
То же, что и в предыдущем примере - разные типы переменных. Результат false.
Задача:
Используя логику описанную выше, разберите последнюю запись примера alert(e === a);
и проверьте ее результат в браузере.
Оператор != (Не равно).
Этот оператор так же, как и оператор == будет анализировать исключительно значения переменных и прибегнет к неявному преобразованию типов в случае, когда участвующие в операции переменные будут иметь разные типы. После преобразования к одному типу опять же проанализирует их значения.
Если значения переменных не равны изначально или не равны после неявного приведения типов вернет true. Если значения равны - вернет false. Давайте рассмотрим на примере:
// переменные одного типа
var a = 1;
var b = 1;
// переменные разных типов
var c = 'привет';
var d = true;
var e = null;
alert(a != b);
alert(c != a);
alert(d != b);
alert(e != a);
Разберем:
Запись alert(a != b);
. В значениях сравнивает 1 != 1
. То есть 1 не равно 1. Но это утверждение неверно, 1 всегда будет равен 1. Поэтому результат false.
Запись alert(c != a)
. В значениях сравнивает 'привет' != 1
. Даже после неявного преобразования типов, строка "привет" никогда не будет равна строке "1". Другими словами операция вида 'привет' != '1'
даст результат true.
Запись alert(d != b);
. А вот для это записи, неявное преобразование сыграет роль для отрицательного результата, ибо после преобразования и нашей ассоциации из предыдущих уроков мы получим сравнение между 1 != 1
. Но единица не моет быть Неравной другой единице. Результат false.
Задача:
Используя логику описанную выше, разберите последнюю запись примера alert(e != a);
и проверьте ее результат в браузере.
Оператор !== (Строго не равно).
Точно так же как и его строгий собрат ===, оператор строго неравенства !== будет сравнивать не только значения переменных, но и их тип. В случае участия переменных разного типа, ни о каком неявном преобразовании типов речь так же идти не будет.
Если значения и типы переменных не равны вернет true. Если значения или тип, или и то и то равны - вернет false. Пример:
// переменные одного типа
var a = 1;
var b = 1;
// переменные разных типов
var c = 'привет';
var d = true;
var e = null;
alert(a !== b);
alert(c !== a);
alert(d !== b);
alert(e !== a);
Разберем:
В записи alert(a !== b);
На первый взгляд все начинается хорошо. Обе переменные одинакового типа. Тто очень важно для строгих операторов сравнения. Но после подстановки значений мы получим 1 !== 1
. Что конечно не является верным (единица всегда будет равна другой единице).
Результат false.
В записи alert(c !== a)
разные типы переменных. Для оператора строго типа это сразу же маячок о том что переменные разные. Результат true.
В записи alert(d !== b);
Аналогично предыдущему. Boolean никогда не будет строго равен Number. Результат true.
Задача:
Используя логику описанную выше, разберите последнюю запись примера alert(e !== a);
и проверьте ее результат в браузере.
Следующие операторы сравнения в случаях взаимодействия переменных с разными типами, всегда будут использовать процесс неявного преобразования типов к одинаковому, и только после этого будут производить сравнения. В случае с взаимодействиями с переменными одинакового типа - просто будут сравнивать значения.
Оператор > (Больше ).
Оператор > двигается слева направо и сравнивает переменную распложенную слева с переменной расположенной справа.
В случае если значение слева больше чем значение справа результат будет true, если нет - результат примет значение false. Рассмотрим на примере:
// переменные одного типа
var a = 1;
var b = 2;
// переменные разных типов
var d = true;
var e = null;
alert(a > b);
alert(d > b);
alert(e > a);
Разберем:
Запись alert(a > b);
. Подставим значения и получим 1 > 2
. Зададим себе вопрос: "Один больше двух?". Очевидно, что нет. Ответ false.
Запись alert(d > b);
. Подставим значения и получим true > 2
. Помним ассоциация и зададим себе вопрос: "Одни больше двух?". Очевидно, что нет. Ответ false.
Задача:
Используя логику описанную выше, разберите последнюю запись примера alert(e > a);
и проверьте ее результат в браузере.
Оператор >= (Больше или равно).
Этот оператор в отличие от предыдущих, будет сравнивать переменные сразу с логической оговоркой "или". Он так же как предыдущий оператор, будет сравнивать значение переменной, расположенной слева со значением переменной, расположенной справа. Так же, как и предыдущий оператор использует неявное преобразование. Однако, положительный результат (true) он вернет и в случае, когда левое значение будет больше чем правое, и в случае если левое значение будет равно правому. Давайте рассмотрим на примере:
// переменные одного типа
var a = 1;
var b = 2;
// переменные разных типов
var d = true;
var e = null;
alert(b >= a);
alert(d >= b);
alert(e >= a);
Разберем:
Запись alert(b >= a);
. Подставим значения и получим 2 >= 1
. Зададим себе вопрос: "Два больше одного?". Очевидно, что да. Сразу же зададим еще вопрос: "Два равно одному?". Конечно нет. И вот только после этого мы можем сказать, что ответ будет true. Так как одно условие все-таки выполнилось.
Запись alert(d >= b);
. Подставим значения и получим true >= 2
. Помним ассоциацию и зададим себе вопрос: "Одни больше двух?". Очевидно, что нет. "А один равен двум?". Тоже нет. Ответ false.
Задача:
Используя логику описанную выше, разберите последнюю запись примера alert(e >= a);
и проверьте ее результат в браузере.
Оператор < (Меньше).
Этот оператор - противоположность оператору > (Больше). Он так же, как и его антипод двигается слева направо и сравнивает переменную, распложенную слева с переменной расположенной справа.
В случае, когда значение слева меньше чем значение справа результат будет true, если нет - результат примет значение false. Рассмотрим на примере:
// переменные одного типа
var a = 1;
var b = 2;
// переменные разных типов
var d = true;
var e = null;
alert(b < a);
alert(d < b);
alert(e < a);
Разберем:
Запись alert(b < a);
. Подставим значения и получим 2 < 1
. Зададим себе вопрос: "Два меньше чем один?". Ответ будет false.
Запись alert(d < b);
. Подставим преобразованные значения и получим 1 < 2
. Помним ассоциацию и зададим себе вопрос: "Одни меньше двух?". Очевидно что да. Ответ true.
Задача:
Используя логику описанную выше, разберите последнюю запись примера alert(e < a);
и проверьте ее результат в браузере.
Оператор <= (Меньше или равно).
Наконец, оператор <= (Меньше или равно), так же как и оператор >= (Больше или равно) выдаст положительный результат true в двух случаях:
- Когда левое значение переменной будет меньше правого.
- Когда левое значение переменной будет равно правому.
Во всех остальных случаях результат работы этого оператора будет равен false. Пример:
// переменные одного типа
var a = 1;
var b = 2;
// переменные разных типов
var d = true;
var e = 2;
alert(a <= b);
alert(d <= b);
alert(e <= b);
Разберем:
Запись alert(a <= b);
. Подставим значения и получим 1 <= 2
. Зададим себе вопрос: "Один меньше чем два?". Конечно! Если хотя бы один из критериев выполнен, то ответ будет true.
Запись alert(d <= b);
. Подставим преобразованные значения и получим 1 <= 2
. Помним ассоциацию и зададим себе вопрос: "Одни меньше двух?". Очевидно что да. Один из двух критериев выполняется, значит ответ - true.
Задача:
Используя логику описанную выше, разберите последнюю запись примера alert(e <= b);
и проверьте ее результат в браузере.
А на сегодня все