Understanding JavaScript Operators

In JavaScript, operators are special symbols or keywords used to perform operations on values and variables. They allow us to manipulate data and control the flow of the code. Let’s break down the most commonly used types of operators and their purposes:

1️⃣ Assignment Operators (=)

The assignment operator is used to assign values to variables.
📌 Example:

let x = 10 // Assigns the value 10 to variable x
let y = 5 // Assigns the value 5 to variable y

2️⃣ Arithmetic Operators

Arithmetic operators perform basic mathematical operations on numbers.

1. + (Addition)
2. - (Subtraction)
3. * (Multiplication)
4. / (Division)
5. % (Modulus – remainder of division)
6. ** (Exponentiation (ES2016))
7. ++ (Increment)
8. -- (Decrement)

📌 Example:

console.log("x + y = " + (x + y)) // Output: x + y = 15
console.log("x - y = " + (x - y)) // Output: x - y = 5
console.log("x / y = " + (x / y)) // Output: x / y = 2
console.log("x * y = " + (x * y)) // Output: x * y = 50
console.log("x % y = " + (x % y)) // Output: x % y = 0
console.log("(x**y) = " + (x**y)) // Output: (x**y) = 100000
console.log("(++x) = " + (++x)) // Output: (++x) = 11
console.log("(x++) = " + (x++)) // Output: (x++) = 11
console.log("(--y) = " + (--y)) // Output: (--y) = 4
console.log("(y--) = " + (y--)) // Output: (y--) = 4

3️⃣ Comparison Operators

Comparison operators compare two values and return a Boolean (true or false). These are often used in loops and branching statements.

1. == (Equal to)
2. === (Strictly equal to)
3. != (Not equal to)
4. !== (Strictly not equal to)
5. < (Less than)
6. > (Greater than)
7. <= (Less than or equal to)
8. >= (Greater than or equal to)

📌 Example:

console.log("(x == y) = " + (x == y)) // Output: (x == y) = false
console.log("(x != y) = " + (x != y)) // Output: (x != y) = true
// Compares datatypes also
console.log("(x === y) = " + (x === y)) // Output: (x === y) = false
// Compares datatypes also
console.log("(x !== y) = " + (x !== y)) // Output: (x !== y) = true
console.log("(x > y) = " + (x > y)) // Output: (x > y) = true
console.log("(x >= y) = " + (x >= y)) // Output: (x >= y) = true
console.log("(y < x) = " + (y < x)) // Output: (y < x) = true
console.log("(y <= x) = " + (y <= x)) // Output: (y <= x) = true

4️⃣ Logical Operators

Logical operators are used to perform logical operations and return a Boolean value (true or false).

1. && (Logical AND)
2. || (Logical OR)
3. ! (Logical NOT)

📌 Example:

let isValidNumber = (x > 8 && 8 > y) // If both condition are correct returns true otherwise false
console.log("(x > 8 && 8 > y) = " + isValidNumber) // Output: (x > 8 && 8 > y) = true

let isValidCheck = (x > 20 || 8 > y) // If one of condition is correct returns true otherwise false
console.log("(x > 20 || 8 > y) = " + isValidCheck) // Output: (x > 20 || 8 > y) = true

let isValid = false
console.log("(!isValid) = " + !isValid) // Output: (!isValid) = true

5️⃣ String Operators

The + operator is versatile and can be used with strings for concatenation (joining two strings). When used with numbers, it performs addition.

📌 Example:

// Concatenation
console.log("Richa " + "webDev") // Output: Richa webDev 
// Addition
console.log(10 + 5) // Output: 15

6️⃣ Ternary Operator (? :)

The ternary operator is a concise way to perform conditional checks. It returns one value if the condition is true and another if it’s false.
🟤 Syntax:

condition ? valueIfTrue : valueIfFalse;

📌 Example:

const isEven = 10 % 2 === 0 ? "Number is even" : "Number is old"
console.log("isEven = " + isEven) // Output: isEven = Number is even

💡 Brain teaser

Explain why the output of the code snippet, involving the num++, --num, and num-- operations, results in the value 21. Comment down below.

let num = 20
console.log("num = " + num) // Output: (++num) = 21
console.log("(++num) = " + (++num)) // Output: (++num) = 21
console.log("(num++) = " + (num++)) // Output: (num++) = 21
console.log("(--num) = " + (--num)) // Output: (--num) = 21
console.log("(num--) = " + (num--)) // Output: (num--) = 21

Output:

num = 20
(++num) = 21
(num++) = 21
(--num) = 21
(num--) = 21

Conclusion

JavaScript operators are fundamental building blocks that help you write effective and efficient code. By mastering them, you can perform a wide range of operations, from simple assignments to complex logical checks. Experiment with these operators to better understand their behavior!
Happy coding ✨