JavaScript Operators

Introduction

An operator takes one or more values (its operands) and produces a new value. In JavaScript, you use operators to do arithmetic, compare values, assign values to variables, and build logical conditions. This chapter covers the operators you reach for every day — assignment, arithmetic, comparison, and string concatenation — explains the type coercion that makes some results surprising, and ends with an operator precedence reference so you know what evaluates first.

A few terms used throughout:

• Operand — the value an operator works on. In 5 + 3, 5 and 3 are operands.
• Unary operator — takes one operand (e.g. -x).
• Binary operator — takes two operands (e.g. x + y).
• Ternary operator — takes three operands; JavaScript has exactly one (?:).

Assignment Operators

The basic assignment operator = stores a value in a variable. The compound assignment operators combine an arithmetic operation with assignment, so x += 5 is shorthand for x = x + 5.

Operator	Example	Equivalent to
=	x = 5	—
+=	x += 5	x = x + 5
-=	x -= 5	x = x - 5
*=	x *= 5	x = x * 5
/=	x /= 5	x = x / 5
%=	x %= 5	x = x % 5
**=	x **= 2	x = x ** 2

---

Note that = is an assignment, not a comparison. To compare values, use === or == (see below).

Arithmetic Operators in JavaScript

Basic Operators: Addition (+), Subtraction (-), Multiplication (*), and Division (/)

These operators perform the four basic arithmetic operations.

---

Modulus (%) and Exponentiation (**)

Modulus (%) returns the remainder of a division — useful for tests like "is this number even?" (n % 2 === 0). Exponentiation (**) raises a number to a power.

---

Unary Plus and Minus

- negates a value, and unary + converts its operand to a number — a quick way to turn a numeric string into a number.

---

Increment (++) and Decrement (--)

++ adds 1 to a variable and -- subtracts 1. Their position matters: the prefix form (++x) changes the value and returns the new one, while the postfix form (x++) returns the old value first, then changes it.

---

JavaScript Comparison Operators

Comparison operators always return a boolean (true or false). See the dedicated Comparison Operators chapter for more detail.

Strict (===) and Loose (==) Equality

Strict equality (===) returns true only when both operands have the same type and the same value — it never converts types. Loose equality (==) first coerces the operands to a common type, then compares, which can give surprising results.

Their negated forms are !== (strict inequality) and != (loose inequality).

---

Greater Than (>), Less Than (<), and Their "or Equal" Forms

These operators compare ordering. They also have >= (greater than or equal) and <= (less than or equal) variants.

---

Comparing Non-Numeric Values

With the relational operators (<, >, <=, >=), JavaScript performs type coercion. The rule: if both operands are strings, they are compared character by character (alphabetically); otherwise both operands are converted to numbers before comparing.

That explains a result that looks wrong at first:

---

NaN Comparisons

NaN (Not-A-Number) is the one value that is not equal to anything, including itself. So === NaN can never be used to detect it. Use Number.isNaN() instead.

---

String Concatenation and the Binary + Operator

Concatenating Strings

In JavaScript, the + operator is used for both numeric addition and string concatenation.

---

Binary + and Type Coercion

When one operand is a string, JavaScript converts the other to a string as well.

---

Best Practices for Concatenation

---

Logical, Conditional, and Type Operators

JavaScript has several more operator families that each have their own chapter. Here is a quick map so you know what they do and where to read more.

Logical Operators (&&, ||, !)

&& (AND), || (OR), and ! (NOT) combine boolean conditions. && and || are also short-circuiting and return one of their operands (not always a boolean), which makes them handy for defaults and guards. See Logical Operators.

---

Conditional (Ternary) Operator (?:)

The ternary operator is a compact if/else that returns a value: condition ? valueIfTrue : valueIfFalse. See Conditional Operators.

---

typeof and instanceof

typeof returns a string naming the type of a value. instanceof tests whether an object was created by a particular constructor — covered in Class Checking: instanceof.

---

Operator Precedence

When an expression mixes operators, precedence decides which runs first, and associativity decides the order among operators of equal precedence. For example, * has higher precedence than +, so 2 + 3 * 4 is 14, not 20.

Here are the common operators from highest precedence to lowest:

Precedence	Operators	Description
Highest	()	Grouping
	++ -- (postfix)	Postfix increment/decrement
	! + - ++ -- typeof (prefix)	Unary operators
	**	Exponentiation (right-associative)
	* / %	Multiply, divide, remainder
	+ -	Add, subtract
	< <= > >= instanceof	Relational comparison
	== != === !==	Equality
	&&	Logical AND
	||	Logical OR
	? :	Conditional (ternary)
Lowest	= += -= …	Assignment (right-associative)

---

Summary and Common Gotchas

• Use === / !==, not == / != unless you specifically want type coercion.
• '2' < true is false because relational operators convert non-string operands to numbers (2 < 1).
• Comparing strings is alphabetical, so '10' < '9' is true even though 10 < 9 is false.
• Test for NaN with Number.isNaN(x) — x === NaN is always false.
• + is overloaded: with a string operand it concatenates ('3' + 2 is '32'); prefer template literals for clarity.
• x++ returns the old value, ++x the new one.
• ** and = are right-associative; most other binary operators are left-associative.
• Reach for parentheses rather than memorizing the full precedence table.

Practice