What Are JavaScript Operators?

Imagine building an online store. You need to calculate the total price, check whether a customer qualifies for a discount, and update the quantity in their cart. JavaScript operators make all of these tasks possible.

An operator is a symbol or keyword that performs an operation on one or more values. The values it works with are called operands.

const price = 20;
const quantity = 3;

const total = price * quantity;

console.log(total);

The multiplication operator * calculates the total. You’ll use operators for everything from simple arithmetic to complex decisions.

Let JavaScript Do the Math

Arithmetic operators work with numbers. JavaScript supports the familiar mathematical operations, plus a few that may be new to you.

console.log(10 + 3);  // 13
console.log(10 - 3);  // 7
console.log(10 * 3);  // 30
console.log(10 / 3);  // 3.333...
console.log(10 % 3);  // 1
console.log(2 ** 3);  // 8

What Each Operator Does

• + adds numbers.
• - subtracts numbers.
• * multiplies numbers.
• / divides numbers.
• % returns the remainder after division.
• ** raises a number to a power.

Update Values Efficiently

You already know that = assigns a value to a variable. JavaScript also offers shortcuts for updating existing values.

let score = 10;

score += 5;  // Add 5
score -= 2;  // Subtract 2
score *= 2;  // Multiply by 2

console.log(score);

The statement score += 5 is shorthand for score = score + 5.

You can also use /=, %=, and **= for division, remainder, and exponentiation.

Compare Values and Get Answers

Comparison operators ask questions about values. Their results are Booleans: either true or false.

console.log(10 > 5);    // true
console.log(10 < 5);    // false
console.log(10 >= 10);  // true
console.log(10 <= 8);   // false
console.log(10 === 10); // true
console.log(10 !== 5);  // true

=== checks strict equality: both values must have the same type and value. !== checks strict inequality.

console.log(5 === "5"); // false
console.log(5 == "5");  // true

The loose equality operator == can convert types before comparing them. Strict equality is generally easier to predict, so it's a good default.

Combine Multiple Conditions

Sometimes one comparison isn't enough. For example, an online store might offer a discount only when a customer has enough points and their account is active.

const points = 120;
const isMember = true;

console.log(points >= 100 && isMember);
console.log(points >= 200 || isMember);
console.log(!isMember);

• && means AND. Both conditions must be true for the combined Boolean expression to be true.
• || means OR. At least one condition must be true.
• ! means NOT. It reverses a Boolean value.

Know the Order of Operations

The plus operator has another job: it can join strings together. This is called concatenation.

console.log(5 + 3);     // 8
console.log("5" + 3);   // "53"
console.log(2 + 3 * 4); // 14
console.log((2 + 3) * 4); // 20

When one operand is a string, + may combine text instead of performing addition. JavaScript also follows operator precedence rules, meaning some operations happen before others.

Multiplication normally happens before addition. Parentheses let you make the intended order explicit.

Make Every Calculation Count

Two handy operators are ++ and --. They increase or decrease a numeric variable by one.

let cartItems = 2;

cartItems++;
console.log(cartItems); // 3

cartItems--;
console.log(cartItems); // 2

Operators are most useful when combined. Let's calculate a purchase total and determine whether it qualifies for free shipping.

const price = 25;
let quantity = 3;

const total = price * quantity;
const freeShipping = total >= 50;

console.log(total);
console.log(freeShipping);

One program can use arithmetic to calculate a value and comparisons to make decisions about it. That's a foundation for building interactive websites.