JavaScript Arithmetic

The typical scenario for handling numbers is arithmetic.

JavaScript Arithmetic Operators

Arithmetic operators perform arithmetic operations on numerical values (literals or variables).

Operator Description
+ Addition
- Subtraction
* Multiplication
** Power (ES2016)
/ Division
% Coefficient
++ Increment
-- Decrease

Arithmetic operators

Typical arithmetic operations operate on two numerical values.

These two numbers can be literals:

Instance

var x = 7 + 8;

Try it yourself

Or variable:

Instance

var x = a + b;

Try it yourself

Or expression:

Instance

var x = (7 + 8) * a;

Try it yourself

Operators and operands

In arithmetic operations, numbers are calledOperands.

The operation (performed between two operands) is defined byOperatorDefinition.

Operands Operator Operands
7 + 8

Addition

Addition) The operator (+) Addend:

var x = 7;
var y = 8;
var z = x + y;

Try it yourself

Subtraction

Subtraction) The operator (-) Minuend.

var x = 7;
var y = 8;
var z = x - y;

Try it yourself

Multiplication

Multiplication) The operator (*) Multiplicand.

var x = 7;
var y = 8;
var z = x * y;

Try it yourself

Division

Division) The operator (/) Divisor.

var x = 7;
var y = 2;
var z = x / y;

Try it yourself

Coefficient

Coefficient) The operator (%) Returns the remainder of the division.

var x = 7;
var y = 2;
var z = x % y;

Try it yourself

Note:In arithmetic, the division of two integers produces a quotient and a remainder.

Note:In mathematics, the result of the modulus operation is the remainder of the arithmetic division.

Increment

Increment) The operator (++) Increments the value.

var x = 7;
x++;
var z = x;

Try it yourself

Decrease

Decrease) The operator (--) Decrements the value.

var x = 7;
x--;
var z = x;

Try it yourself

Exponent

The exponentiation operator (**) raises the first operand to the power of the second operand.

Instance

var x = 5;
var z = x ** 2;          // The result is 25

Try it yourself

The result of x ** y is the same as Math.pow(x,y):

Instance

var x = 5;
var z = Math.pow(x,2);   // The result is 25

Try it yourself

Operator precedence

Operator precedence (Operator precedence) describes the order of operations executed in arithmetic expressions.

Instance

var x = 200 + 50 * 2;

Try it yourself

What is the result of 250 * 2 or 200 + 100 in the example above?

Is addition or multiplication prioritized?

In traditional school mathematics, multiplication is prioritized.

Multiplication (*）and division (%）and addition (+）and subtraction (-）has a higherPrecedence.

At the same time, (just like in school mathematics) the precedence can be changed by using parentheses:

Instance

var x = (200 + 50) * 2;

Try it yourself

When using parentheses, the operators within the parentheses are calculated first.

When multiple operators have the same precedence (such as addition and subtraction), their calculations are performed from left to right:

Instance

var x = 200 + 50 - 2;

Try it yourself

JavaScript operator precedence values

Value Operator Description Instance
20 ( ) Expression grouping (3 + 4)
　 　 　 　
19 . Member person.name
19 [] Member person["name"]
19 () Function call myFunction()
19 new Create new Date()
　 　 　 　
17 ++ Postfix increment i++
17 -- Postfix decrement i--
　 　 　 　
16 ++ Prefix increment ++i
16 -- Prefix decrement --i
16 ! Logical NOT !(x==y)
16 typeof Type typeof x
　 　 　 　
15 ** Power (ES7) 10 ** 2
　 　 　 　
14 * Multiply 10 * 5
14 / Division 10 / 5
14 % Modulus division 10 % 5
　 　 　 　
13 + Add 10 + 5
13 - Subtract 10 - 5
　 　 　 　
12 << Left shift x << 2
12 >> Right shift x >> 2
12 >>> Right shift (unsigned) x >>> 2
　 　 　 　
11 < Less x < y
11 <= Less than or equal x <= y
11 > Greater x > y
11 >= Greater than or equal x >= y
11 in Property in an object "PI" in Math
11 instanceof Instance of an object instanceof Array
　 　 　 　
10 == Equal x == y
10 === Strict equality x === y
10 != Not Equal x != y
10 !== Strictly Not Equal x !== y
　 　 　 　
9 & Bitwise AND x & y
8 ^ Bitwise XOR x ^ y
7 | Bitwise OR x | y
6 && Logical AND x && y
5 || Logical NOT x || y
4 ? : Conditional ? "Yes" : "No"
　 　 　 　
3 = Assignment x = y
3 += Assignment x += y
3 -= Assignment x -= y
3 *= Assignment x *= y
3 %= Assignment x %= y
3 <<= Assignment x <<= y
3 >>= Assignment x >>= y
3 >>>= Assignment x >>>= y
3 &= Assignment x &= y
3 ^= Assignment x ^= y
3 |= Assignment x |= y
　 　 　 　
2 yield Pause Function yield x
1 , Comma 7, 8

Note:Light red indicates experimental or suggested technologies (ECMASScript 2016 or ES7)

Tip:The expression in parentheses is fully evaluated before its value is used in the rest of the expression.