Как выполнять математические операции с помощью JavaScript

Введение

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

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

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

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

Арифметические операторы

Арифметические операторы — это символы, обозначающие математическую операцию и возвращающие значение. В уравнении 3 + 7 = 10 символ + — это синтаксис, обозначающий сложение.

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

Вот справочная таблица арифметических операторов JavaScript.

Оператор	Синтаксис	Пример	Определение
Добавление	`+`	`x + y`	Сумма `x` и `y`
вычитание	`-`	`x - y`	Разница `x` и `y`
Умножение	`*`	`x * y`	Произведение `x` и `y`
Разделение	`/`	`x /y`	Частное `x` и `y`
Модуль	`%`	`x % y`	Остаток `x /y`
Возведение в степень	`**`	`x ** y`	`x` в степени `y`
Увеличение	`++`	`x++`	`x` плюс один
Уменьшение	`--`	`x--`	`x` минус один

В этой статье мы подробно рассмотрим каждый из этих операторов.

Сложение и вычитание

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

Мы можем выполнить простое сложение с числами, например, сложив 10 и 20, используя знак плюс ( + ).

10 + 20;

Помимо выполнения математических операций с простыми числами, мы также можем присваивать числа переменным и выполнять те же вычисления. В этом случае мы можем присвоить числовые значения x и y и поставить сумму z.

//Assign values to x and y
 let x = 10;
 let y = 20;

 //Add x and y and assign the sum to z
 let z = x + y;

 console.log(z);

Точно так же мы используем знак минус ( - ) для вычитания чисел или переменных, представляющих числа.

//Assign values to x and y
 let x = 10;
 let y = 20;

 //Subtract x from y and assign the difference to z
 let z = y - x;

 console.log(z);

Мы также можем складывать и вычитать отрицательные (десятичные) числа и числа с плавающей запятой.

//Assign values to x and y
 let x = -5.2;
 let y = 2.5;

 //Subtract y from x and assign the difference to z
 let z = x - y;

 console.log(z);

-7.7

Интересно отметить и иметь в виду в JavaScript результат сложения числа и строки. Мы знаем, что 1 + 1 должно равняться 2, но это уравнение будет иметь неожиданные результаты.

let x = 1 + "1";

 console.log(x);
 typeof x;

11
 'string'

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

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

Умножение и деление

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

Звездочка ( * ) используется для обозначения оператора умножения.

//Assign values to x and y
 let x = 20;
 let y = 5;

 //Multiply x by y to get the product
 let z = x * y;

 console.log(z);

Умножение можно использовать для расчета цены товара после применения налога с продаж.

const price = 26.5; //Price of item before tax
 const taxRate = 0.082; //8.2% tax rate

 //Calculate total after tax to two decimal places
 let totalPrice = price + (price * taxRate);
 totalPrice.toFixed(2);

 console.log("Total:", totalPrice);

Total: 28.67

Косая черта ( / ) используется для представления оператора деления.

//Assign values to x and y
 let x = 20;
 let y = 5;

 //Divide y into x to get the quotient
 let z = x /y;

 console.log(z);

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

Модуль

Немного менее известный арифметический оператор — это оператор по модулю (иногда известный как модуль), который вычисляет остаток от частного после деления. Модуль представлен знаком процента ( % ).

Например, мы знаем, что число 3 входит в число 9 ровно три раза и остатка нет.

9 % 3;

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

//Initialize function to test if a number is even
 const isEven = x => {
 //If the remainder after dividing by two is 0, return true
 if (x % 2 === 0) {
 return true;
 }
 //If the number is odd, return false
 return false;
 }

 //Test the number
 isEven(12);

true

В приведенном выше примере мы делим 12 на 2 без остатка, так что это четное число.

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

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

Возведение в степень — это один из новых операторов в JavaScript, который позволяет нам вычислять мощность числа на основе его показателя степени. Синтаксис: две звездочки в одной строке ( ** ).

10 в пятой степени, или 10 ^ 5, записывается так:

10 ** 5;

10 ** 5 представляет собой 10, умноженное на 10 пять раз:

10 * 10 * 10 * 10 * 10;

Другой способ записать это с помощью метода Math.pow().

Math.pow(10, 5);

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

Увеличение и уменьшение

Операторы инкремента и декремента увеличивают или уменьшают числовое значение переменной на единицу. Они представлены двумя знаками плюс ( ++ ) или двумя знаками минус ( -- ) и часто используются с циклами.

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

7++

Uncaught ReferenceError: Invalid left-hand side expression in postfix operation

Операторы инкремента и декремента могут быть классифицированы как префиксные или постфиксные операции, в зависимости от того, помещается ли оператор до или после переменной.

Во-первых, мы можем написать приращение префикса с помощью ++x.

//Set a variable
 let x = 7;

 //Use the prefix increment operation
 let prefix = ++x;

 console.log(prefix);

Значение x увеличилось на единицу. Чтобы увидеть разницу, мы проверим приращение постфикса с помощью y++.

//Set a variable
 let y = 7;

 //Use the prefix increment operation
 let postfix = y++;

 console.log(postfix);

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

let y = 7;

 y++;
 y++;

 console.log(y);

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

//Run a loop ten times
 for (let i = 0; i < 10; i++) {
 console.log(i);
 }

Приведенный выше код показывает итерацию цикла, который достигается с помощью оператора приращения.

Мы можем думать о x++ как о сокращении для x = x + 1, а x-- как о сокращении для x = x - 1.

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

Одним из наиболее часто используемых операторов является оператор присваивания, который мы уже видели и который представлен знаком равенства ( = ). Мы используем =, чтобы присвоить значение справа переменной слева.

//Assign 27 to age variable
 let age = 27;

В дополнение к стандартному оператору присваивания в JavaScript есть составные операторы присваивания, которые объединяют арифметический оператор с =.

Например, оператор сложения начнет с исходного значения и добавит новое значение.

//Assign 27 to age variable
 let age = 27;

 age += 3;

 console.log(age);

В этом случае age += 3 совпадает с возрастом письма age = age + 3.

Оператор	Синтаксис
Назначение	`=`
Дополнительное назначение	`+=`
Назначение вычитания	`-=`
Назначение умножения	`*=`
Назначение отдела	`/=`
Оставшееся назначение	`%=`
Назначение возведения в степень	`**=`

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

Приоритет оператора

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

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

//First multiply 3 by 5, then add 10
 10 + 3 * 5;

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

//First add 10 and 3, then multiply by 5
 (10 + 3) * 5;

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

Приращение/уменьшение, умножение/деление и сложение/вычитание имеют одинаковый уровень приоритета.

Оператор	Синтаксис
Скобки	`()`
Инкремент	`++`
Декрементация	`--`
Возведение в степень	`**`
Умножение	`*`
Разделение	`/`
Добавление	`+`
вычитание	`-`

Приоритет оператора включает не только арифметические операторы, но и операторы присваивания, логические операторы, условные операторы и многое другое. Чтобы просмотреть полный список, просмотрите приоритет операторов в Mozilla Developer Network (MDN).

Вывод

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

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