Making Decisions in Code

Conditional statements allow your code to make decisions and execute different code based on conditions.

The if/else statement is the most common way to control program flow.

// Basic if Statement
let age = 18;
if (age >= 18) {
  console.log('You are an adult');
}

// if-else Statement
if (age >= 18) {
  console.log('You can vote');
} else {
  console.log('You cannot vote yet');
}

// if-else if-else
let score = 85;
if (score >= 90) {
  console.log('Grade: A');
} else if (score >= 80) {
  console.log('Grade: B');
} else if (score >= 70) {
  console.log('Grade: C');
} else {
  console.log('Grade: F');
}

// Ternary Operator (shorthand)
let message = age >= 18 ? 'Adult' : 'Minor';

// Multiple Conditions
let isWeekend = true;
let isHoliday = false;

if (isWeekend || isHoliday) {
  console.log('No work today!');
}

if (age >= 18 && hasLicense) {
  console.log('Can drive');
}

• if - Execute code if condition is true
• else - Execute code if condition is false
• else if - Check multiple conditions
• Ternary operator - Shorthand if/else
• && - AND operator (both must be true)
• || - OR operator (one must be true)
• ! - NOT operator (negates condition)

<div class="conditional-demo">
  <h3>Age Checker</h3>
  <input type="number" id="ageInput" placeholder="Enter your age">
  <button onclick="checkAge()">Check</button>
  <div id="ageResult"></div>
  
  <hr style="margin: 20px 0;">
  
  <h3>Grade Calculator</h3>
  <input type="number" id="scoreInput" placeholder="Enter score (0-100)" min="0" max="100">
  <button onclick="calculateGrade()">Calculate Grade</button>
  <div id="gradeResult"></div>
</div>