Стать программистом. Часть 13. Основы JavaScript для абсолютных новичков!


Доброе время суток, друзья!

В прошлом уроке мы с Вами знакомились с операторами присваивания. Мы рассмотрели на практике основные из них. Привели примеры и познакомились с тем, как работает неявное преобразование типов в работе с этими операторами, а также рассмотрели основные алгоритмы, которые призваны помочь нам в вычислении результатов операций с этими операторами. В конце предыдущего урока была дана задача. Если у кого-то возникли вопросы с ее выполнением - пишите в комментариях я помогу разобраться.
В сегодняшнем уроке мы рассмотри еще одни операторы для взаимодействия между переменными.
Эти операторы, как и предыдущие занимает достаточно большое поле использования в JavaScript. Они носят название - Comparison Operators или Операторы сравнения. Сама тема достаточно обширная, но все-таки мы постараемся полностью рассмотреть ее в этом уроке.
Операторы сравнения часто идут бок о бок с логическими операторами, которые мы рассматривали в одном из наших предыдущих уроков.

Но давайте обо всем по порядку. Итак, начнем

УРОК 13. Другие возможные взаимодействия между переменными. Операторы сравнения.

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

Вот список операторов сравнения, которые мы будем рассматривать:

  1. == (Равно).
  2. === (Строго равно).
  3. != (Не равно).
  4. !== (Строго не равно).
  5. > (Больше ).
  6. >= (Больше или равно).
  7. < (Меньше).
  8. (Меньше или равно).

Результатом операций с участием операторов сравнения всегда будет одно из двух возможных булевских значений. Другими словами, не важно какой из операторов сравнения используется в данный момент, результатом его работы всегда будет либо 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( >= 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 в двух случаях:

  1. Когда левое значение переменной будет меньше правого.
  2. Когда левое значение переменной будет равно правому.

Во всех остальных случаях результат работы этого оператора будет равен false. Пример:


// переменные одного типа
var a = 1;
var b = 2;

// переменные разных типов
var d = true;   
var e = 2;

alert(a <= b);
alert(d   `alert(a  Подставим значения и получим `1  Зададим себе вопрос: "Один меньше чем два?". Конечно! Если хотя бы один из критериев выполнен, то ответ будет **true**.

Запись `alert(d  Подставим преобразованные значения и получим `1  Помним ассоциацию и зададим себе вопрос: "Одни меньше двух?". Очевидно что да. Один из двух критериев выполняется, значит ответ - **true**.

### Задача:

Используя логику описанную выше, разберите последнюю запись примера `alert(e  и проверьте ее результат в браузере.

<hr />
 
 

А на сегодня все 
  
### Ссылки на предыдущие уроки:
1.  Урок 1.
2.  Урок 2.
3.  Урок 3.
4.  Урок 4.
5.  Урок 5.
6.    Урок 6.
7.    Урок 7.
8.    Урок 8.
9.    Урок 9.
10.    Урок 10.
11.    Урок 11.
12.    Урок 12.

Comments 2


Привет!

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

Спасибо за полезный контент (ノ◕ヮ◕)ノ*:・゚✧

12.02.2017 12:32
0

Руслан, не большая ошибка у тебя.

Запись alert(b >= a);. Подставим значения и получим 2 >= 1. Зададим себе вопрос: "Два больше один?". Очевидно, что нет. Но сразу же зададим еще вопрос: "Два равно одному?". Тоже нет. И вот только после этого мы можем сказать, что ответ будет false.

12.02.2017 12:47
0

Благодарю, исправил.

12.02.2017 13:01
0

Друг, ошибка еще на месте)

07.03.2017 11:16
0

13 уроков проглочено. Жду продолжения.
Спасибо.

13.02.2017 10:53
0

@rassen, Поздравляю!,
Ваш пост был упомянут в моем хит-параде в следующей категории:

  • Выплаты - 3 позицию - 2098,9660 GESTS
14.02.2017 07:01
0