DEV Community

Cover image for JavaScript Operators: The Basics You Need to Know
Umar Hayat
Umar Hayat

Posted on

JavaScript Operators: The Basics You Need to Know

🎙️ Introduction

Hey readers — welcome to my corner of the internet.

The last time we saw each other, we explored the basics of JavaScript variables and data types.

Blog Link — Variables and Datatypes

I started that blog from a complete beginner’s point of view, and honestly, that was intentional. When you’re learning JavaScript — or any programming language — your fundamentals matter a lot.

Learning a new language can feel exciting, but sometimes it can also throw confusing concepts at you out of nowhere. If your basics aren’t clear, those concepts can knock you out pretty quickly.

So instead of rushing ahead, we’re laying another strong foundation today.

Let’s talk about Operators.


🧰 Operators: The tools that work on your variables

In the previous blog, we talked about variables as boxes that store values.

But storing something in a box is only half the story.

Imagine keeping something in a box but never opening it or using what’s inside. That would feel like a waste, right?

The same thing happens with variables in programming. They store data in memory — but we need a way to work with that stored data.

That’s where operators come in.

Operators are special symbols or keywords that perform operations on values or variables — such as arithmetic, comparison, assignment, or logic.

Simple Analogy

  • Variables = Boxes that store values
  • Operators = Tools that work on those values

Example:

6+1
Enter fullscreen mode Exit fullscreen mode

Here:

6 and 1  Operands (values)
+        Operator
Enter fullscreen mode Exit fullscreen mode

Operands are simply the values or variables that operators work on.

JavaScript has many types of operators, but we’ll focus on the most common ones that developers use every day.


➕ Arithmetic Operators — Doing Math in JavaScript

Alright, let’s start with something familiar.

You’ve been using these since your school math days — the good old arithmetic operators.

Arithmetic Operators perform basic mathematical operations.

These are the ones developers use all the time.

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

Example:

leta=10;
letb=3;

// addition
console.log(a+b);// 13

// subtraction
console.log(a-b);// 7

// multiplication
console.log(a*b);// 30

// division
console.log(a/b);// 3.33

// modulus → gives remainder of division
console.log(a%b);// 1
Enter fullscreen mode Exit fullscreen mode

Let’s Focus on a Special One

⇒ Modulus Operator %

The modulus operator returns the remainder after division.

Example:

8%3// 2
Enter fullscreen mode Exit fullscreen mode

Why 2?

Because:

3 goes into 8 two times  3 × 2 = 6
8 - 6 = 2 (remainder)
Enter fullscreen mode Exit fullscreen mode

And that remainder is what % returns.

Real-world use case

One common use of % is checking even or odd numbers.

Even numbers divide perfectly by 2.

letnumber=8;

console.log(number%2===0);
// true → number is even
Enter fullscreen mode Exit fullscreen mode

Pretty useful, right?

Now that we can calculate values, let’s move on to comparing them.


🔍 Comparison Operators — Asking Questions in Code

Comparison operators help our code ask questions.

Comparison Operators compare two values and return a Boolean result — either true or false.

These are heavily used inside conditions and decision-making.

Common comparison operators include:

Operator Meaning
== Equal to
=== Strict equal
!= Not equal
> Greater than
< Less than

Example:

letmyAge=25;
letdogAge=5;

if (myAge>dogAge) {
console.log("I’m older than the dog 🐶");
}else {
console.log("Wait… is the dog older?!");
}
Enter fullscreen mode Exit fullscreen mode

Another example:

letcatFavorite="fish";
letofferedFood="broccoli";

if (catFavorite!=offeredFood) {
console.log("The cat gives you a judgmental stare 😾");
}else {
console.log("The cat is happy and purrs 🐱");
}
Enter fullscreen mode Exit fullscreen mode

⚠️ Important Concept: == vs ===

This is one of the first important JavaScript lessons beginners learn.

== (Loose Equality)

  • Compares values
  • Allows type conversion (type coercion)

Example:

5=="5"// true
0==false// true
null==undefined// true
Enter fullscreen mode Exit fullscreen mode

JavaScript converts values internally before comparing them.


=== (Strict Equality)

  • Compares both value and type
  • Does not perform type conversion

Example:

5==="5"// false (number vs string)
0===false// false (number vs boolean)
null===undefined// false
Enter fullscreen mode Exit fullscreen mode

Best Practice

Most developers prefer using === because it avoids unexpected type conversions and keeps code predictable.

So whenever possible, it’s safer to rely on strict equality.

Alright, now that we can compare values, let’s combine multiple conditions.


🧠 Logical & Assignment Operators — Making decisions and Updating Values


Logical Operators

Logical operators help us combine conditions and make decisions in code.

They are commonly used with if statements, loops, and other control flows.

Operator Name Description
&& AND Returns true if both operands are true
! NOT Inverts the Boolean value

Example

// Life with mom 😭

let momHome = true;
let badGrades = true;
let cleanedRoom = false;

// AND
console.log(momHome && badGrades);
// Mom is home AND you got bad grades = Trouble 😭

// OR
console.log(badGrades || !cleanedRoom);
// Bad grades OR messy room = Still trouble 😬

// NOT
console.log(!cleanedRoom);
// NOT cleaned room = Mom is angry 🧹
Enter fullscreen mode Exit fullscreen mode

Logical operators make it possible to build complex conditions in our programs.


Assignment Operators

Now let’s talk about updating variables

This is a basic assignment:

let score = 10;
score = score + 5;
Enter fullscreen mode Exit fullscreen mode

But the JavaScript has shortcuts that make this neater:

score += 5; // same as score =  score + 5
Enter fullscreen mode Exit fullscreen mode

Common Assignment Operators:

Operator Meaning
= Assign value
+= Add and assign
-= Subtract and assign

Example

let points = 20;

points += 10; // 30
points -= 5;  // 25
Enter fullscreen mode Exit fullscreen mode

These shortcuts make your code shorter and cleaner.


📝 Assignment Section


1️⃣ Perform arithmetic operations:

let a = 15;
let b = 4;

/*
Calculate:
i) a + b
ii) a - b
iii) a * b
iv) a % b

*/
Enter fullscreen mode Exit fullscreen mode

2️⃣ Compare values

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

// Observe the differences
Enter fullscreen mode Exit fullscreen mode

3️⃣ Logical condition

let age = 20;
let hasTicket = true;

console.log(age > 18 && hasTicket); // guess the output...
Enter fullscreen mode Exit fullscreen mode

🎯 Ending Thought

Operators are the actions of JavaScript.

They allow us to perform calculations, compare values, combine conditions, and update variables based on our needs.

Without operators, variables would simply sit there in memory doing nothing.

If variables are boxes that store your data, then operators are the tools you use to work with what’s inside those boxes.

And once you start combining variables with the right operators, that’s when your programs actually start doing something useful.

That’s it folks.

Till then —

KEEP LEARNING | BE CURIOUS | PEACE OUT ✌️

Top comments (0)