Understanding Core Operators in JavaScript

If you read my previous blog on Understanding Variables and Data Types, you know how to store information in the computer's memory. You know how to build a box, label it, and put a string or a number inside.

But a box sitting in memory doesn't make a web application. To build software, you have to manipulate that data. You have to add numbers together, check if a user's password matches the database, or decide whether to show a light or dark theme.

If variables are the nouns of JavaScript, operators are the verbs. They are the special symbols that tell the engine to perform an action on your data.

There are dozens of operators in JavaScript, but you can build almost anything by mastering four main categories: Assignment, Arithmetic, Comparison, and Logical.

1. Assignment Operators: Storing the Data

We start here because you already know the most important operator in the language: the single equals sign (=).

In mathematics, = means "these two things are equivalent." In JavaScript, = is the Assignment Operator. It means "take the value on the right, and put it into the box on the left."

let score = 10; // Assigns the value 10 to 'score'

As your program runs, you will often need to update a variable based on its current value. For example, if a player scores a point, you might write:

score = score + 1;

This works, but it's repetitive. JavaScript gives us shorthand assignment operators to do the math and the assignment in one step:

• += (Add and assign): score += 1;

• -= (Subtract and assign): score -= 5;

2. Arithmetic Operators: Doing the Math

JavaScript can act as a very powerful calculator. The basic arithmetic operators function exactly as you learned in grade school:

• + (Addition)

• - (Subtraction)

• * (Multiplication)

• / (Division)

let totalCost = 15 + 5;      // 20
let discount = totalCost - 2; // 18
let tax = totalCost * 0.10;   // 2

The Modulo Operator (%)

There is one math operator that confuses beginners because of its symbol: %.

In JavaScript, % has nothing to do with percentages. It is the Modulo (or Remainder) operator. It divides the first number by the second number, and only gives you the remainder.

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

Why 1? Because 3 goes into 10 three times (which equals 9), leaving a remainder of 1.

Modulo is incredibly useful in programming. The most common use case is checking if a number is even or odd. If you do number % 2, an even number will always return 0, and an odd number will always return 1.

3. Comparison Operators: Asking Questions

You don't just calculate data; you have to evaluate it. Comparison operators allow you to ask the computer a question. The computer will always answer with a Boolean: true or false.

The basic comparisons are straightforward:

• > (Greater than): 10 > 5 (true)

• < (Less than): 10 < 5 (false)

The Big Trap: == vs ===

If a single equals sign (=) is used for assignment, how do we ask if two things are actually equal?

JavaScript gives us two different operators for this: the loose equality (==) and the strict equality (===). Understanding the difference is a rite of passage for every JavaScript developer.

== (Loose Equality): If you ask JavaScript 5 == "5", it notices that one is a Number and the other is a String. To be helpful, it converts the String into a Number behind the scenes, and then compares them.

console.log(5 == "5"); // Output: true

=== (Strict Equality): Strict equality does not do any conversions behind your back. It compares the value and the data type. If the types don't match, it immediately says false.

console.log(5 === "5"); // Output: false

The Golden Rule: Always, always use ===. Loose equality (==) causes unpredictable bugs because JavaScript's automatic type conversion is full of weird quirks. Using === forces you to be explicit and keeps your code safe. (The same applies to not-equal: always use !== instead of !=).

4. Logical Operators: Combining Rules

Often, a single question isn't enough. You might want to let a user log in only if their username is correct AND their password is correct. For this, we use Logical Operators.

&& (AND)

The && operator checks if both sides are true. If even one side is false, the whole thing is false.

let isAdult = true;
let hasTicket = false;

console.log(isAdult && hasTicket); // Output: false

|| (OR)

The || operator checks if at least one side is true. It only returns false if both sides are completely false.

let isWeekend = true;
let isHoliday = false;

console.log(isWeekend || isHoliday); // Output: true

! (NOT)

The ! operator is the flipper. You put it in front of a boolean value to reverse it. It turns true to false, and false to true.

let isRaining = true;
console.log(!isRaining); // Output: false

The Truth Table

If you ever get confused about how && and || combine values, refer to this standard truth table:

Summary: The Operator Toolkit

Here is a quick reference table of everything we just covered:

What's Next?

Right now, we are just printing true or false to the console. But in real-world applications, those boolean answers are used to change the direction of your program.

If isAdmin === true, we want to show the admin dashboard. If false, we want to kick them back to the login page. To do that, we take these operators and plug them into Control Flow statements like if / else.

If you want to keep building your JavaScript mental model, check out how we structure larger collections of data in my blog on JavaScript Arrays 101. The better you understand your operators, the easier it becomes to manipulate those data structures.