JavaScript Arithmetic: Operators, Examples and Complete Guide

JavaScript arithmetic is the process of performing mathematical calculations in JavaScript. It is one of the most basic and important parts of the language because almost every application needs some form of calculation.

JavaScript can perform simple operations such as addition, subtraction, multiplication, and division. It can also handle more advanced operations such as finding remainders, raising numbers to powers, increasing or decreasing values, and working with special numeric values such as Infinity and NaN.

Whether you are building a calculator, shopping cart, financial application, game, form, dashboard, or data-processing tool, understanding JavaScript arithmetic is essential.

What Is JavaScript Arithmetic?

JavaScript arithmetic means using JavaScript operators and values to perform mathematical calculations.

For example:

let a = 10;
let b = 5;

console.log(a + b); // 15
console.log(a - b); // 5
console.log(a * b); // 50
console.log(a / b); // 2

Here, +, -, *, and / are arithmetic operators.

JavaScript supports several arithmetic operators:

Addition Operator (+)

The addition operator adds two values.

let x = 10;
let y = 20;

let result = x + y;

console.log(result); // 30

The + operator has an important special behavior in JavaScript. It can also join strings.

let firstName = "Dibya";
let lastName = "Mendali";

console.log(firstName + " " + lastName);

Output:

Dibya Mendali

This means the + operator can perform either numerical addition or string concatenation, depending on its operands.

Adding Numbers

console.log(5 + 3); // 8

Joining Strings

console.log("Hello " + "World"); // Hello World

Number and String

JavaScript may convert a number to a string when + is used with a string.

console.log(10 + "5"); // "105"

This is an important behavior to understand because it can sometimes produce unexpected results.

Subtraction Operator (-)

The subtraction operator subtracts the right-hand value from the left-hand value.

let x = 20;
let y = 8;

console.log(x - y); // 12

Unlike +, the - operator does not concatenate strings.

JavaScript may convert string values containing numbers into numbers during subtraction:

console.log("20" - 5); // 15

However, a non-numeric string produces NaN.

console.log("Hello" - 5); // NaN

Multiplication Operator (*)

The multiplication operator multiplies two values.

let price = 10;
let quantity = 5;

let total = price * quantity;

console.log(total); // 50

It can also work with numeric strings through JavaScript’s type conversion:

console.log("10" * 5); // 50

Division Operator (/)

The division operator divides the left-hand value by the right-hand value.

let total = 100;
let people = 4;

console.log(total / people); // 25

JavaScript uses floating-point arithmetic, so division does not necessarily produce an integer.

console.log(10 / 3); // 3.3333333333333335

Division by Zero

JavaScript behaves differently from some traditional programming languages when dividing a number by zero.

console.log(10 / 0); // Infinity

A negative number divided by zero can produce negative infinity:

console.log(-10 / 0); // -Infinity

However, zero divided by zero produces NaN:

console.log(0 / 0); // NaN

Remainder Operator (%)

The remainder operator returns the remainder after division.

console.log(10 % 3); // 1

The calculation is effectively:

10 ÷ 3 = 3 remainder 1

The remainder operator is useful for many programming tasks.

Checking Even and Odd Numbers

let number = 12;

if (number % 2 === 0) {
    console.log("Even");
} else {
    console.log("Odd");
}

Checking Divisibility

let number = 15;

if (number % 5 === 0) {
    console.log("Divisible by 5");
}

The % operator is also useful for repeating patterns, cycling through values, and controlling positions in games and other applications.

Exponentiation Operator (**)

The exponentiation operator raises one number to the power of another.

console.log(2 ** 3); // 8

This means:

2 × 2 × 2 = 8

Another example:

console.log(5 ** 2); // 25

The operator can also be used with variables:

let base = 3;
let exponent = 4;

console.log(base ** exponent); // 81

Increment Operator (++)

The increment operator increases a variable by one.

let count = 5;

count++;

console.log(count); // 6

It is equivalent to:

count = count + 1;

There are two forms of increment:

• Prefix increment: ++x
• Postfix increment: x++

These forms can produce different results when the expression itself is being evaluated.

Prefix Increment

let x = 5;

console.log(++x); // 6
console.log(x);  // 6

The value is increased before it is used in the expression.

Postfix Increment

let x = 5;

console.log(x++); // 5
console.log(x);   // 6

The original value is used first, and then the variable is increased.

Decrement Operator (--)

The decrement operator decreases a variable by one.

let count = 5;

count--;

console.log(count); // 4

It is equivalent to:

count = count - 1;

Like increment, decrement has prefix and postfix forms.

Prefix Decrement

let x = 5;

console.log(--x); // 4

Postfix Decrement

let x = 5;

console.log(x--); // 5
console.log(x);   // 4

Unary Plus (+)

A single + placed before a value is called the unary plus operator. It attempts to convert the value into a number.

console.log(+"10"); // 10

It can also convert other values:

console.log(+true);  // 1
console.log(+false); // 0

An invalid numeric string becomes NaN:

console.log(+"Hello"); // NaN

Although unary plus can be useful, explicit conversion such as Number() is often clearer in code intended for beginners or for long-term maintenance.

Unary Minus (-)

Unary minus changes the sign of a numeric value.

let x = 10;

console.log(-x); // -10

It can also convert numeric strings before applying the negative sign:

console.log(-"10"); // -10

Arithmetic With Variables

Arithmetic operations are commonly performed using variables.

let a = 25;
let b = 10;

let sum = a + b;
let difference = a - b;
let product = a * b;
let quotient = a / b;

console.log(sum);
console.log(difference);
console.log(product);
console.log(quotient);

This makes programs easier to understand and maintain.

Arithmetic With Constants

Constants can also be used for calculations.

const price = 100;
const tax = 18;

const total = price + tax;

console.log(total); // 118

A const variable cannot be reassigned, but its value can still participate in arithmetic expressions.

Operator Precedence

JavaScript does not always evaluate arithmetic operations from left to right. Operators have different precedence levels.

For example:

let result = 10 + 5 * 2;

console.log(result); // 20

Multiplication is performed before addition:

5 × 2 = 10
10 + 10 = 20

A useful general order for common arithmetic operators is:

1. Parentheses
2. Exponentiation
3. Multiplication, division, and remainder
4. Addition and subtraction

For example:

let result = (10 + 5) * 2;

console.log(result); // 30

Parentheses force the addition to happen first.

Use Parentheses for Clarity

Even when you know operator precedence, parentheses can make code easier to read.

let total = (price * quantity) + shipping;

This clearly shows the intended calculation.

Arithmetic Expressions

An arithmetic expression is a combination of values, variables, and operators that produces a value.

let result = 10 + 20 * 3;

The expression produces:

70

Another example:

let width = 10;
let height = 5;

let area = width * height;

Here, width * height is an arithmetic expression.

JavaScript Numbers

Most ordinary numerical calculations in JavaScript use the Number type.

JavaScript numbers are based on the IEEE 754 double-precision floating-point format. This allows JavaScript to represent a very large range of values, but it also means that some decimal calculations cannot be represented exactly.

For example:

console.log(0.1 + 0.2);

The result may be:

0.30000000000000004

This does not mean JavaScript’s arithmetic is broken. It is a consequence of how binary floating-point numbers represent decimal fractions.

Floating-Point Precision

This is particularly important when working with money, measurements, statistics, and other calculations that require exact decimal behavior.

For simple display purposes, you can round the result:

let result = 0.1 + 0.2;

console.log(result.toFixed(2)); // "0.30"

Remember that toFixed() returns a string.

let result = (0.1 + 0.2).toFixed(2);

console.log(typeof result); // "string"

For applications requiring exact financial calculations, developers may use integer units such as cents or specialized decimal arithmetic libraries rather than relying directly on binary floating-point values.

NaN

NaN means “Not-a-Number.” It represents a value that is not a valid numerical result.

For example:

console.log("Hello" * 5); // NaN

Another example:

let result = Number("abc");

console.log(result); // NaN

You can check for NaN using Number.isNaN():

console.log(Number.isNaN(NaN)); // true
console.log(Number.isNaN(10));  // false

Using Number.isNaN() is generally preferable to the global isNaN() when you specifically want to determine whether a value is the numeric NaN value.

Infinity

JavaScript supports positive and negative infinity.

console.log(10 / 0);  // Infinity
console.log(-10 / 0); // -Infinity

You can check whether a value is finite:

console.log(Number.isFinite(100));      // true
console.log(Number.isFinite(Infinity)); // false

Infinity can also result from calculations involving very large numbers.

Arithmetic With Numeric Strings

JavaScript performs implicit type conversion in many arithmetic operations.

For example:

console.log("10" - "3"); // 7

Multiplication and division also convert numeric strings:

console.log("10" * "2"); // 20
console.log("20" / "4"); // 5

However, addition behaves differently:

console.log("10" + "2"); // "102"

Because both operands are strings, + performs concatenation.

This difference is one of the most common sources of confusion for JavaScript beginners.

Explicit Type Conversion

To avoid unexpected results, you can convert values explicitly.

Using Number():

let a = "10";
let b = "20";

let result = Number(a) + Number(b);

console.log(result); // 30

This is often clearer than depending on implicit conversion.

BigInt Arithmetic

JavaScript also provides the BigInt type for integers larger than the safe range of ordinary Number values.

BigInt literals use an n suffix:

let a = 9007199254740993n;
let b = 2n;

console.log(a + b);

BigInt supports several arithmetic operators, including:

+  -  *  /  %  **

However, you cannot normally mix BigInt and Number directly in the same arithmetic operation.

This causes an error:

let a = 10n;
let b = 5;

console.log(a + b);

Instead, use the same numeric type:

let a = 10n;
let b = 5n;

console.log(a + b); // 15n

BigInt division truncates toward zero because BigInt represents integers.

console.log(7n / 2n); // 3n

BigInt is useful when integer values can exceed the safe integer range of Number.

Safe Integers

JavaScript provides limits for integers that can be represented safely using Number.

You can inspect them using:

console.log(Number.MAX_SAFE_INTEGER);
console.log(Number.MIN_SAFE_INTEGER);

The maximum safe integer is:

9007199254740991

For integers beyond this range, BigInt may be more appropriate when exact integer arithmetic is required.

You can test whether a number is a safe integer:

console.log(Number.isSafeInteger(100)); // true

Arithmetic Assignment Operators

JavaScript provides shorthand operators for modifying variables.

Instead of:

let x = 10;

x = x + 5;

you can write:

let x = 10;

x += 5;

The result is 15.

Common arithmetic assignment operators include:

Examples:

let x = 10;

x += 5;
console.log(x); // 15

x -= 3;
console.log(x); // 12

x *= 2;
console.log(x); // 24

x /= 4;
console.log(x); // 6

Arithmetic and Boolean Values

JavaScript can convert Boolean values to numbers in some arithmetic operations.

console.log(true + 1);  // 2
console.log(false + 1); // 1

This happens because true is converted to 1 and false is converted to 0.

Although JavaScript permits this behavior, explicit conversion is usually better when readability matters.

console.log(Number(true) + 1); // 2

Arithmetic With null

In numeric operations, null is generally converted to 0.

console.log(null + 5); // 5

However, relying heavily on automatic conversion can make code harder to understand. Explicitly handling values is usually safer in larger applications.

Arithmetic With undefined

Arithmetic involving undefined generally produces NaN.

let x;

console.log(x + 5); // NaN

This is another reason to validate input before performing calculations.

Arithmetic With Arrays and Objects

JavaScript’s automatic type conversion can produce surprising results when arrays or objects are involved.

For example:

console.log([] + 1); // "1"

Such behavior comes from JavaScript’s type conversion rules rather than ordinary numerical arithmetic.

For reliable calculations, use actual numeric values and explicitly convert user input when necessary.

Calculating Percentages

JavaScript makes percentage calculations straightforward.

let price = 1000;
let discount = 20;

let discountAmount = price * discount / 100;

console.log(discountAmount); // 200

You can then calculate the final price:

let finalPrice = price - discountAmount;

console.log(finalPrice); // 800

Calculating Averages

An average can be calculated by adding values and dividing by their count.

let a = 80;
let b = 90;
let c = 70;

let average = (a + b + c) / 3;

console.log(average); // 80

Calculating Area

Arithmetic is frequently used in geometry.

For a rectangle:

let width = 10;
let height = 5;

let area = width * height;

console.log(area); // 50

For a circle:

let radius = 5;

let area = Math.PI * radius ** 2;

console.log(area);

Here, Math.PI provides the value of π.

Arithmetic With User Input

Values received from HTML form controls are commonly strings. This is important when performing calculations.

For example:

let first = document.querySelector("#first").value;
let second = document.querySelector("#second").value;

These values are strings.

If you want numerical addition, convert them:

let result = Number(first) + Number(second);

Without conversion, this could happen:

"10" + "20"

which produces:

"1020"

rather than 30.

The Math Object

JavaScript’s Math object provides additional mathematical functionality.

Common methods include:

Math.round(4.6); // 5
Math.floor(4.9); // 4
Math.ceil(4.1);  // 5
Math.abs(-10);   // 10
Math.sqrt(25);   // 5
Math.pow(2, 3);  // 8

The exponentiation operator is generally more concise for powers:

2 ** 3

instead of:

Math.pow(2, 3)

Rounding Numbers

JavaScript provides several useful rounding methods.

Math.round()

Rounds to the nearest integer.

console.log(Math.round(4.4)); // 4
console.log(Math.round(4.6)); // 5

Math.floor()

Rounds toward negative infinity.

console.log(Math.floor(4.9)); // 4

Math.ceil()

Rounds toward positive infinity.

console.log(Math.ceil(4.1)); // 5

Math.trunc()

Removes the fractional portion.

console.log(Math.trunc(4.9));  // 4
console.log(Math.trunc(-4.9)); // -4

Absolute Values

Math.abs() returns the absolute value.

console.log(Math.abs(-25)); // 25

This is useful when the direction or sign of a difference is not important.

For example:

let difference = Math.abs(80 - 100);

console.log(difference); // 20

Square Roots

Use Math.sqrt() to calculate a square root.

console.log(Math.sqrt(64)); // 8

Random Numbers

Math.random() produces a pseudo-random number from 0 up to, but not including, 1.

console.log(Math.random());

A common pattern for generating an integer from 1 to 10 is:

let number = Math.floor(Math.random() * 10) + 1;

console.log(number);

This is useful for games, simulations, random selections, and similar tasks.

Common Arithmetic Mistakes

Mistake 1: Confusing + With Numeric Addition

let a = "10";
let b = "20";

console.log(a + b); // "1020"

Convert the values when numerical addition is intended:

console.log(Number(a) + Number(b)); // 30

Mistake 2: Forgetting Operator Precedence

let result = 10 + 5 * 2;

The result is 20, not 30.

Use parentheses when needed:

let result = (10 + 5) * 2;

Mistake 3: Ignoring NaN

Always consider whether an input can fail numeric conversion.

let value = Number("abc");

console.log(value); // NaN

Validation is important before using external or user-provided values.

Mistake 4: Assuming Decimal Arithmetic Is Always Exact

console.log(0.1 + 0.2);

Floating-point precision can produce a result slightly different from the expected decimal representation.

Mistake 5: Mixing Number and BigInt

let a = 10n;
let b = 5;

// a + b causes an error

Use matching types:

let a = 10n;
let b = 5n;

console.log(a + b);

Best Practices for JavaScript Arithmetic

Use meaningful variable names.

let productPrice = 500;
let quantity = 3;

let totalPrice = productPrice * quantity;

Prefer clear expressions over unnecessarily complicated shortcuts.

Use parentheses when they make the intended order obvious.

Convert input values explicitly when you expect numbers.

Validate data before performing calculations.

Use Number.isNaN() and Number.isFinite() when checking numerical results.

Be careful with decimal precision when working with money.

Use BigInt when exact integer calculations exceed the safe Number range.

Avoid depending unnecessarily on JavaScript’s implicit type conversion.

A Practical Example

Here is a simple shopping calculation:

let price = 500;
let quantity = 3;
let discountPercent = 10;
let taxPercent = 18;

let subtotal = price * quantity;
let discount = subtotal * discountPercent / 100;
let afterDiscount = subtotal - discount;
let tax = afterDiscount * taxPercent / 100;
let finalTotal = afterDiscount + tax;

console.log("Subtotal:", subtotal);
console.log("Discount:", discount);
console.log("Tax:", tax);
console.log("Final Total:", finalTotal);

This example demonstrates how multiple arithmetic operators can work together to solve a practical problem.

JavaScript Arithmetic vs. Assignment

It is important to distinguish arithmetic operators from assignment operators.

This performs arithmetic:

x + y

This assigns a value:

x = y

This combines arithmetic with assignment:

x += y

Understanding this difference helps prevent many common programming errors.

Summary

JavaScript arithmetic provides the foundation for numerical calculations in web applications and other JavaScript programs. The main arithmetic operators are +, -, *, /, %, and **. JavaScript also provides increment and decrement operators, arithmetic assignment operators, and the Math object for more advanced calculations.

A key point to remember is that JavaScript’s + operator can perform both numerical addition and string concatenation. Type conversion is therefore important when working with user input or values received from other sources.

JavaScript uses floating-point numbers for ordinary numerical calculations, so decimal precision should be considered when exact results are important. For very large integers, BigInt provides an alternative to the regular Number type.

Once you understand arithmetic operators, operator precedence, type conversion, floating-point behavior, NaN, Infinity, and basic mathematical methods, you have a strong foundation for building more advanced JavaScript applications.