«Единственный способ творить великие дела – это любить то, что ты делаешь»
JavaScript

Игра на «Морской Бой» на JavaScript: Простая Игра и Игра для Двоих


Здесь продолжается тема операторов в JavaScript и речь пойдет о приоритете операторов.

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

Вы узнаете, что такое инкремент и декремент. Сокращенные арифметические операции. Как пользоваться таблицей приоритета операторов?

И это заключительная статья, подводящая итог в изучении темы о переменных, типах данных и операторах.

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

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

var now = 2020; // Текущий год

var yearJohn = 1991; // Год рождения Джона

var fullAge = 18; // Возраст совершеннолетия

На основании имеющихся данных легко вычислить возраст Джона и сравнить его с числом 18.

var isFullAge = now - yearJohn >= fullAge;

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

Но как JavaScript узнает - какое действие выполнить в первую очередь?

Если предположить, что сначала выполняется логический оператор сравнения: yearJohn >= fullAge, в результате чего возвращается true или false (истина или ложь). А потом из текущего года вычитается одно из этих значений: now - yearJohn >= fullAge. То такой порядок действий ничего существенного не дает. Мы не получим того, что хотели бы видеть.

Ожидается (так и происходит в действительности), что сначала выполняется первый оператор «минус», то есть выражение now- yearJohn. В результате мы получим возраст Джона, то есть какое-то число, которое потом будет сравниваться с другим числом - 18. И этот вариант работает.

console.log(isFullAge);

true

В результате выражение возвращает true. Это значит, что возраст Джона больше 18 лет, то есть он совершеннолетний. И это действительно так, потому что исходя из имеющихся данных - ему 29 лет.

Стоит уделить немного внимания приоритету операторов, и выяснить: почему и какой оператор выполняется первым?

Таблица приоритета операторов

По ссылкам далее можно перейти к таблице приоритета операторов, которая упорядочена с самого высокого приоритета до самого низкого - от 20 до 1. Эта ссылка ведет на страницу автора англоязычного курса. И вот ссылка на русскоязычный источник.

Из таблицы приоритета операторов видно, что операторы «+» и «-» (плюс и минус - позиция №13) находятся в приоритете перед оператором сравнения >= (больше или равно - позиция №11), который использовался в примере выше.

Оператор присваивания или оператор равенства «=» (знак равно) имеет позицию №3 - это почти самый низкий приоритет. И это имеет смысл, так как, конечно же, в большинстве случаев мы ожидаем, что присваивание происходит на последнем этапе, что фактически и происходит.

Итак, нужно понимать, что знак равно или оператор присваивания тоже участвует в работе. Учитывая это, следует отметить, что в выражении из примера выше мы имеем дело с тремя операторами: минус №13, оператор сравнения №11 и оператор присваивания №3.

Оператор группировки - Скобки ( )

Рассмотрим еще один пример с использованием оператора группировки - это скобки (). Вычислим средний возраст Джона и Марка.

var now = 2020; // Текущий год

var yearJohn = 1991; // Год рождения Джона

var ageJohn = now - yearJohn; // Возраст Джона

var ageMark = 35; // Возраст Марка

var average = ageJohn + ageMark / 2; // Средний возраст - Неверное выражение

console.log(average);

46.5

В данном случае выражение для вычисления среднего возраста составлено НЕ верное.

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

В JavaScript это правило работает аналогично, что видно из таблицы приоритета операторов: деление (позиция №14) имеет приоритет перед сложением (позиция №13).

Итак, чтобы выражение var average = ageJohn + ageMark / 2 для вычисления среднего возраста работало правильно, нужно использовать скобки, чтобы объединить в группу операцию сложения двух переменных. Это опять же должно быть известно из школьного курса.

И в JavaScript это тоже так. Из таблицы приоритета операторов видно, что оператор группировки (скобки) имеет самый высокий приоритет (позиция №20).

var average = (ageJohn + ageMark) / 2; // Средний возраст - Верное выражение

console.log(average);

32

Одновременное присваивание

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

Создаем две переменные для работы с простыми математическими операциями.

var x, y;

x = (3 + 5) * 4 - 6;

console.log(x);

26

Учитывая приоритет выполнения операторов не сложно вычислить результат, который равен 26. При этом следует учитывать и это нужно помнить и понимать, что только после выполнения всех вычислений, в последнюю очередь происходит присваивание (знак равно). В данном случае переменной x присваивается значение 26.

Теперь, если мы захотим значение переменной x присвоить и переменной y, то сделать это очень просто.

x = y = (3 + 5) * 4 - 6;

console.log(x, y);

26 26

Здесь выводятся в консоль 2 переменные одновременно, чего ранее не делалось. И соответственно в консоли мы видим два результата одновременно.

Ассоциативность

Теперь предлагается взглянуть на последний пример с двойным присваиванием немного иначе. Слева - направо. Что мы видим?

x = y - на этом этапе переменная y еще не определена - Undefined, так как ранее var x, y, переменные x и y были объявлены, но для них не было определено какое-либо значение. Из этого можно сделать логическое заключение, что переменная x тоже не определена - Undefined. Но это не так. Что и было продемонстрировано выводом в консоль обеих переменных x и y, значением которых является одно и то же число 26.

Чтобы окончательно разобраться, как работает выражение в примере выше, предлагается снова обратиться к таблице приоритета операторов. В этой таблице помимо столбца «Приоритет», по которому операторы упорядочены с самого высокого приоритета до самого низкого под номерами от 20 до 1, существует столбец Ассоциативность - он означает направление, в котором оператор выполняется. И если для примера посмотреть на строку Умножение или Сложение, то мы увидим, что эти операторы выполняются слева направо.

То есть если взять для примера выражение: 2 + 3 + 8 , то в нем сначала суммируются числа 2 и 3. Затем результат первого сложения, то есть число 5 суммируется с числом 8. Сложение происходит слева направо.

Но не все операторы работаю так: некоторые выполняются справа налево. Одним из них является оператор «Присваивание» - он выполняется справа налево. И это является ответом на вопрос: почему это выражение x = y = (3 + 5) * 4 - 6 работает именно так? В действительности сначала выполняется второй оператор присваивания, то есть y = (3 + 5) * 4 - 6 или y = 26. Затем первый оператор присваивания: x = y - это значит, что значением переменной x также является число 26.

Так работает Ассоциативность согласно таблице приоритета операторов. Поэтому следует помнить не только о приоритете операторов, но и об ассоциативности.

Сокращенные арифметические операции

Рассмотрим еще несколько операторов.

Допустим переменную x нужно увеличить в 2 раза. Можно сделать так:

x = x * 2;

console.log(x);

52

При этом x повторяется два раза.

В JavaScript есть возможность сделать то же самое, но немного проще.

x *= 2; //сокращенное умножение

console.log(x);

52

Итак, здесь продемонстрирована сокращенная форма записи умножения.

Помимо умножения, сокращенные формы записи работают и для других математических операций: деление, сложение и вычитание. Рассмотрим пример со сложением:

var z = 4;

z += 10; //сокращенное сложение

console.log(z);

14

О сокращенных арифметических операциях также читайте здесь.

Сокращенные арифметические операции тоже есть в таблице приоритета операторов и относятся к типу «Присваивание».

Инкремент и Декремент

И последнее о чем речь пойдет в этой статье - Инкремент и Декремент - это соответственно увеличение и уменьшение значения переменной на единицу. Как это выглядит в JavaScript?

x = x + 1; //к переменной x прибавляется единица

x += 1; //сокращенное сложение

x++; //Инкремент - Увеличение переменной x на единицу

Итак, Инкремент - это простейшая и самая удобная форма записи, которая используется, если значение переменной нужно увеличить на единицу.

var x = 26;

x++; //Инкремент

console.log(x);

27

Аналогичная ситуация обстоит с вычитанием, для которого существует термин Декремент.

var y = 26;

y--; //Декремент

console.log(y);

25

Декремент - это простейшая и самая удобная форма записи, которая используется, если значение переменной нужно уменьшить на единицу.

Этой информации достаточно, чтобы можно было сказать, что вы узнали все о переменных, типах данных и об операторах. Хорошо, если пройденный материал принес пользу и вообще имел смысл для Вас. И тем более, хорошо, если вы получили немного удовольствия при его изучении.

Следующим шаг - решение практической задачи "Coding Challenge". Это первая задача кодирования, где нужно будет применить все полученные знания на практике.



Читайте также...

Отзывы и комментарии:

Комментариев нет...

Оставить отзыв:

Ваше Имя:

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

Ответьте на вопрос:

Сколько дней в Високосном году?


На этой странице

НЕ Рунет

Тематические публикации
Популярные заметки
Последние заметки