How To Do Math in JavaScript with Operators

Introduction

Working with numbers is a common task in web development. JavaScript treats all numeric values with a single number data type, so understanding JavaScript operators is essential for calculations, UI positioning, price computations, and many other practical tasks. This guide explains core JavaScript arithmetic operators, assignment forms, and how operator precedence in JavaScript affects evaluations.

JavaScript arithmetic operators

JavaScript arithmetic operators perform basic math and some programming-specific operations. Below are the most frequently used math operators and concise examples showing how they behave with the numeric data type and when mixed with strings.

• + — addition or string concatenation
• - — subtraction
• * — multiplication
• / — division
• % — remainder (JavaScript modulo operator)
• ** — exponentiation (JavaScript exponentiation operator)
• ++ — increment (increment and decrement operator JavaScript)
• -- — decrement

Addition and subtraction

Use + and - for sums and differences. Remember that + also concatenates when one operand is a string.

// numeric addition
let a = 10 + 20; // 30

// adding variables
let x = 10;
let y = 20;
let z = x + y; // 30

// mixing number and string
let mixed = 1 + "1"; // "11" (string concatenation)
console.log(typeof mixed); // "string"

Multiplication and division

Use * and / for products and quotients. These JavaScript math operators are common for calculations like taxes, averages, and unit conversions.

// multiplication
let price = 26.5;
let taxRate = 0.082; // 8.2%
let total = price + price * taxRate; // calculate total price
let fixed = total.toFixed(2); // "28.67"

// division
let hours = 120 / 60; // 2 hours

JavaScript modulo operator (%)

The modulo operator returns the remainder after division. It is useful for parity checks, cycling indexes, and scheduling tasks.

// remainder
9 % 3; // 0
7 % 3; // 1

// check even/odd
const isEven = n => n % 2 === 0;
isEven(12); // true
isEven(7);  // false

JavaScript exponentiation operator (**)

The double-asterisk operator raises a base to an exponent. It is a concise alternative to Math.pow and is useful in math-heavy code.

// exponentiation examples
10 ** 5; // 100000
2 ** 3;  // 8

// same using Math.pow
Math.pow(10, 5); // 100000

Increment and decrement operator JavaScript

Use ++ and -- to add or subtract one from a variable. They come in prefix and postfix forms which affect the value returned in an expression.

// prefix vs postfix
let i = 7;
let prefix = ++i;  // i becomes 8, prefix === 8

let j = 7;
let postfix = j++; // postfix === 7, then j becomes 8

// common use in loops
for (let k = 0; k < 10; k++) {
  console.log(k);
}

JavaScript assignment operators

Assignment operators set or update a variable's value. Besides the basic =, compound assignment operators combine arithmetic with assignment to shorten expressions.

• = — assignment
• += — addition assignment
• -= — subtraction assignment
• *= — multiplication assignment
• /= — division assignment
• %= — remainder assignment
• **= — exponentiation assignment

// compound assignment examples
let age = 27;
age += 3; // same as age = age + 3 -> 30

let total = 5;
total *= 2; // total = 10

Operator precedence JavaScript (order of operations)

Operator precedence determines how expressions are evaluated. Parentheses have the highest priority and can change the natural order (PEMDAS-like behavior).

// multiplication has higher precedence than addition
10 + 3 * 5; // 25  (3*5 = 15, then 10 + 15)

// parentheses change the order
(10 + 3) * 5; // 65  (10+3 = 13, then 13*5)

When using increment/decrement within expressions, be mindful that postfix has a different evaluation timing than prefix. For full operator precedence details, consult official references like MDN.

Practical tips and common pitfalls

• Remember JavaScript uses one numeric type—integers and floats are the same type under the hood.
• Watch out for implicit conversion: adding numbers to strings triggers concatenation.
• Use parentheses to make intent clear when combining multiple JavaScript math operators.
• Prefer compound assignment operators for concise, readable updates in loops and accumulations.

Conclusion

Understanding JavaScript operators—especially arithmetic and assignment operators and operator precedence—helps you write predictable, maintainable code. Whether you are implementing a console calculator, computing totals with tax, or using modulo to check even/odd values, these operators form the foundation of many programming tasks.

Want to practice? Try writing small functions that use the JavaScript modulo operator (%) to alternate styles, or use the exponentiation operator (**) to compute powers for a simple calculator.