Skip to main content

Command Palette

Search for a command to run...

JavaScript Operators: The Basics You Need to Know

Updated
9 min read
JavaScript Operators: The Basics You Need to Know
C

CSE student documenting my learning in databases, networking, and web fundamentals.

In the previous article, we learned how to store information using variables. But learning how to store information is only the first step in our programming journey.

If we write:

let a = 10;
let b = 5;

We get two numbers.

Now what if we want to add them? Or compare them? Or check if both values meet a certain condition?

How can we do it? That's where operators come in.


What are Operators?

In simple words, operators are symbols that tell JavaScript to perform an action.

But what kind of actions?

They can be:

  • Adding numbers.

  • Comparing values.

  • Checking conditions.

  • Updating variables.

Without operators, variables would just sit there doing nothing.

Let’s take a look at some of the operators in JavaScript that we use in everyday programming.

Operator Category Operators
Arithmetic + - * / %
Comparison == === != > < >= <=
Assignment = += -= *= /= %=
Logical `&&

Now that you’ve seen the categories, don’t worry about memorizing them. We’ll understand them one by one, with simple examples.

Let’s start with something familiar. Basic math.


Section 1: Arithmetic Operators

Let us go back to our numbers:

let a = 10;
let b = 3;

What do you think, this will print?

console.log(a + b);

Pause for a moment and think!

It will print:

13

Same as you expected, right?
The + operator adds two values.

Now try this:

console.log(a - b);
console.log(a * b);
console.log(a / b);

It will print:

7
30
3.3333333333333335

The - operator subtracts two values. The * operator multiplies two numbers and / operator divides them.

So far, so good.

Now here’s something slightly interesting:

console.log(a % b);

What do you expect? If you are unsure, try running it.

It prints:

1

The % operator gives the remainder after division.

So, 10 divided by 3 gives remainder 1.

Operator Description
+ Addition
- Subtraction
* Multiplication
/ Division
% Modulus (Division Remainder)

Section 2: Comparison Operators

Comparison operators help us compare two values. They always return true or false.

They answer questions like:

  • Are these two values equal?

  • Is one value greater than the other?

  • Is one value smaller?

Let’s start with something interesting.

console.log(5 == "5");
console.log(5 === "5");

Before reading further, pause for a moment.
What do you think will be printed? Will both lines give the same result?
Take a moment and think.

Now, let us see the output:

true
false

Surprising? Both compare 5 and "5". So why are the results different?

== (Loose Equality)

The == operator checks if two values are equal. But before comparing, JavaScript tries to convert the values to the same type.

So, in this case:

5 == "5"

JavaScript converts the string "5" into the number 5. Then it compares:

5 == 5

Which is true.

=== (Strict Equality)

The === operator is stricter. It checks:

  • value

  • type

Both must match.

So, in this case:

5 === "5"

The value looks similar. But the types are different:

  • 5 → number

  • "5" → string

Since the types don’t match, the result is:

false

Note that:

In modern JavaScript, it’s recommended to use ===. Because it avoids unexpected type conversions. It makes your code more predictable.

Other Comparison Operators

These are more straightforward.

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

They behave exactly like basic math comparisons.

Notice, ! stands for not.

Operator Description
== Equal to
=== Equal value and type
!= Not equal
> Greater than
< Less than
>= Greater than or equal to
<= Less than or equal to

Section 3: Logical Operators

Logical operators are used when we want to combine conditions. They are very common in programming because real decisions usually depend on more than one condition.

The three basic logical operators are:

Operator Description
&& Logical AND
! Logical NOT

Let’s understand them one by one.

&& (AND Operator)

The && operator returns true only if both conditions are true.

Example:

let age = 20;
let hasID = true;

console.log(age > 18 && hasID);

What do you think this prints?

It will print:

true

Reason:

  • age > 18 → true

  • hasID → true

  • true AND true → true

Now change hasID to false. What happens? The result becomes false. Because with &&, both must be true.

Here’s a small truth table for &&:

A B A && B
false false false
false true false
true false false
true true true

Notice, only one case gives true.

|| (OR Operator)

The || operator returns true if at least one condition is true.

Example:

let hasCoupon = false;
let isPremiumUser = true;

console.log(hasCoupon || isPremiumUser);

What do you think this prints?

It will print:

true

Because at least one condition is true.

Here’s a small truth table for ||:

| A | B | A || B | | --- | --- | --- | | false | false | false | | false | true | true | | true | false | true | | true | true | true |

Notice, only one case gives false.

! (NOT Operator)

The ! operator simply reverses a boolean value.

Example:

let isLoggedIn = true;

console.log(!isLoggedIn);

It will print:

false

It flips:

  • true → false

  • false → true


Section 4: Assignment Operators

So far, we’ve been using this operator = again and again.
This is the basic assignment operator. It assigns a value to a variable.

Example:

let score = 10;

Here, = assigns 10 to score. Remember the box analogy from our previous article? Here, we have a box named score, and we are putting the value 10 inside it.

But JavaScript gives us shortcuts when we want to update a variable using its current value. Sounds complex? Let’s see what that means.

The Long Way vs The Short Way

Suppose we have:

let points = 10;

Now we want to increase points by 5. How to do it?

We can write:

points = points + 5;

This works perfectly.
But JavaScript allows a shorter way. Want to see how?

points += 5;

Both lines do the same thing. The second one is just cleaner.

Let's break it down
points += 5; means:

Take the current value of points.
Add 5 to it.
Store the result back in points.

Now try this:

let balance = 100;

balance -= 20;
console.log(balance);

What do you think it prints?

It prints:

80

Because balance -= 20; is the same as balance = balance - 20;

Other Assignment Operators

JavaScript provides similar shortcuts like +=:

let x = 10;

x -= 1;  // same as x = x - 1
x *= 2;  // same as x = x * 2
x /= 4;  // same as x = x / 4
x %= 3;  // same as x = x % 3

These operators help keep your code shorter and cleaner.

Now that we’ve covered all the basic operator types, let’s put everything together.


Practice Time

Now it’s your turn. Let’s combine everything we learned.

Step 1: Create Two Numbers

Create two variables:

  • num1

  • num2

Assign any numbers you like.

Example:

let num1 = 12;
let num2 = 4;

Step 2: Perform Arithmetic Operations

Print the result of:

  • Addition

  • Subtraction

  • Multiplication

  • Division

  • Remainder

Try writing this yourself before looking below.

console.log(num1 + num2);
console.log(num1 - num2);
console.log(num1 * num2);
console.log(num1 / num2);
console.log(num1 % num2);

Step 3: Compare the Values

Try:

console.log(num1 > num2);
console.log(num1 < num2);
console.log(num1 == num2);
console.log(num1 === num2);

Now try something interesting:

console.log(num1 == "12");
console.log(num1 === "12");

Observe the difference carefully.

Step 4: Use Logical Operators

Create two conditions:

  • num1 > 10

  • num2 < 5

Now combine them using:

console.log(num1 > 10 && num2 < 5);
console.log(num1 > 10 || num2 < 5);
console.log(!(num1 > 10));

Try changing the values and see how the result changes.

Step 5: Use Assignment Operators

Now try updating one of the variables:

num1 += 5;
num2 *= 2;

console.log(num1);
console.log(num2);

Make sure you understand what happened.


Wrapping Up

In this article, we explored how JavaScript works with data using operators.

We covered:

  • Arithmetic operators (+ - * / %)

  • Comparison operators (==, ===, >, <)

  • Logical operators (&&, ||, !)

  • Assignment operators (=, +=, -= and more)

Operators are what make programming powerful. Variables store data. Operators allow us to manipulate, compare, and make decisions using that data.

Take a few minutes to experiment with the examples. Change numbers. Change conditions. Observe the results.


What's Next

Now that you know how to:

  • Store data

  • Perform operations

  • Compare values

  • Combine conditions

The next natural step is learning how JavaScript makes decisions based on those conditions.
In the next article, we’ll explore Conditional Statements — how JavaScript uses if, else, and switch to control the flow of a program. Because knowing a condition is true or false is only useful when your program knows what to do next.


⬅ Previous Article: Variables in JavaScript

➡ Next Article: Control Flow in JavaScript

JavaScript Foundations

Part 10 of 11

This series documents my journey of learning JavaScript from the ground up. Each article explains core JavaScript concepts in a beginner-friendly way with simple examples and practical explanations. Topics include variables, operators, control flow, functions, arrow functions, arrays, objects, and more. If you're starting your JavaScript journey, this series will help you build a strong foundation step by step.

Up next

A Beginner’s Guide to Variables and Data Types in JavaScript

Imagine you have a few empty boxes in front of you. You write “Name” on one box and “Age” on another. Then you put your name inside the first box and your age inside the second. In JavaScript, a varia