Day 4: Operators Showdown 🤺

Day 4: Operators Showdown 🤺

Theme: JavaScript's version of a gladiator match – operators battling to give us the right answers! Today, you’ll become a champion of arithmetic, comparison, and logical operators. We’ll also have a True or False quiz at the end to test your operator skills!


1. Welcome to the Operator Arena! 🏟️

JavaScript has some powerful operators, and they fall into three main categories:

  • Arithmetic Operators: Perform math operations.

  • Comparison Operators: Help us compare values.

  • Logical Operators: Combine multiple conditions and return a boolean result.


2. The Champions of Arithmetic 🧮

These operators help us with basic math tasks like adding, subtracting, multiplying, etc. Let’s meet them:

OperatorMeaningExampleResult
+Addition5 + 27
-Subtraction5 - 23
*Multiplication5 * 210
/Division10 / 25
%Modulus (remainder)5 % 21
**Exponentiation (power)2 ** 38

Quick Math Fun 🧩

javascriptCopy codelet apples = 5;
let oranges = 3;
let totalFruits = apples + oranges;

console.log(`I have ${totalFruits} fruits.`); // Output: I have 8 fruits.

💡 Mini Challenge: What’s the result of 15 % 4? (Answer: 3)


3. Comparison Operators: Truth or Dare? 🤔

These operators compare two values and return true or false.

OperatorMeaningExampleResult
==Equal to5 == '5'true
===Strictly equal (type + value)5 === '5'false
!=Not equal5 != 3true
!==Strictly not equal5 !== '5'true
>Greater than5 > 2true
<Less than5 < 2false
>=Greater than or equal to5 >= 5true
<=Less than or equal to3 <= 5true

Quick Comparison Fun 🎯

javascriptCopy codelet age = 18;
console.log(age >= 18); // Output: true (Eligible for voting!)

💡 Mini Challenge: Is '5' == 5 true or false? (Answer: true)
Why? Because == checks only value, not type!


4. Logical Operators: The Strategy Masters 🧠

These operators let you combine multiple conditions. The result is either true or false.

OperatorMeaningExampleResult
&&AND (Both conditions must be true)true && falsefalse
``OR (At least one condition must be true)
!NOT (Reverses the truth)!truefalse

Logical Fun 🧩

javascriptCopy codelet isSunny = true;
let haveUmbrella = false;

if (isSunny || haveUmbrella) {
  console.log("I'm ready to go outside!"); // Output: I'm ready to go outside!
} else {
  console.log("Better stay in.");
}

💡 Mini Challenge: What will !(5 > 3) return? (Answer: false)


5. Quiz Time: True or False? 🧐

Test your operator knowledge! For each question, guess whether the result will be true or false.


1.

javascriptCopy codeconsole.log(10 > 5 && 5 < 2);

Your Guess: 🤔 (Answer: false)


2.

javascriptCopy codeconsole.log('10' == 10);

Your Guess: 🤔 (Answer: true)


3.

javascriptCopy codeconsole.log(5 % 2 === 1);

Your Guess: 🤔 (Answer: true)


4.

javascriptCopy codeconsole.log(false || true);

Your Guess: 🤔 (Answer: true)


5.

javascriptCopy codeconsole.log(!(5 === '5'));

Your Guess: 🤔 (Answer: true)


6. Recap: What Did You Learn Today?

  • Arithmetic Operators: Add, subtract, and divide your way to victory!

  • Comparison Operators: Compare values and see who’s bigger.

  • Logical Operators: Combine conditions and control logic.


7. Fun Practice Challenge: Pizza Party Planner 🍕

Imagine you’re planning a pizza party! Use operators to make sure only guests with enough pizza money or coupons are allowed in.

javascriptCopy codelet hasPizzaMoney = true;
let hasPizzaCoupon = false;

if (hasPizzaMoney || hasPizzaCoupon) {
  console.log("You're invited to the pizza party! 🍕");
} else {
  console.log("Sorry, no pizza for you. 😢");
}

Great Job! 🎉 Tomorrow, you’ll dive into Conditionals – JS Drama 🥷, where you’ll decide the fate of your code using if-else statements! 🧑‍💻 Keep practicing, and see you tomorrow!