If statement in Javascript - Mini Project: Build & Apply

If Statement Basics in JavaScript

📖 Scenario: You are creating a simple program to check if a person is old enough to vote. In many countries, the voting age is 18 years.

🎯 Goal: Build a program that uses an if statement to check if a person's age is 18 or older and print a message accordingly.

📋 What You'll Learn

Create a variable called age with a specific number value.

Create a variable called votingAge set to 18.

Use an if statement to check if age is greater than or equal to votingAge.

Print 'You are old enough to vote.' if the condition is true.

Print 'You are not old enough to vote.' if the condition is false.

💡 Why This Matters

🌍 Real World

Checking conditions like age limits is common in websites and apps, for example, to allow access to age-restricted content.

💼 Career

Understanding if statements is a basic skill for any programming job, as it helps make decisions in code.

1

Create the age variable

Create a variable called age and set it to the number 20.

Javascript

// Create a variable called age and set it to 20
// Your code here

Hint

Use let age = 20; to create the variable.

2

Set the voting age

Create a variable called votingAge and set it to the number 18.

Javascript

let age = 20;
// Create a variable called votingAge and set it to 18
// Your code here

Hint

Use let votingAge = 18; to create the variable.

3

Write the if statement

Use an if statement to check if age is greater than or equal to votingAge. Inside the if block, write console.log('You are old enough to vote.');. Use an else block to write console.log('You are not old enough to vote.');.

Javascript

let age = 20;
let votingAge = 18;
// Write an if statement to check if age >= votingAge
// Inside if, print 'You are old enough to vote.'
// Inside else, print 'You are not old enough to vote.'
// Your code here

Hint

Use if (age >= votingAge) { ... } else { ... } structure.

4

Display the result

Run the program and observe the output. It should print You are old enough to vote..

Javascript

let age = 20;
let votingAge = 18;
if (age >= votingAge) {
    console.log('You are old enough to vote.');
} else {
    console.log('You are not old enough to vote.');
}
// Run the program to see the output

Hint

Look at the console output to see the message.

Practice

1. What does an if statement do in JavaScript?

easy

A. Declares a variable

B. Repeats code multiple times

C. Defines a new function

D. Runs code only if a condition is true

Solution

1. Step 1: Understand the purpose of an if statement

   An if statement checks a condition and runs code only when that condition is true.

2. Step 2: Compare options with the definition

   Only Runs code only if a condition is true matches this behavior exactly.

3. Final Answer:

   Runs code only if a condition is true -> Option D

4. Quick Check:

   If statement = runs code if true [OK]

Hint: If it runs code only when true, it's an if statement [OK]

Common Mistakes:

• Confusing if with loops
• Thinking if declares variables
• Mixing if with function definitions

2. Which of the following is the correct syntax for an if statement in JavaScript?

easy

A. if condition { console.log('Yes'); }

B. if (condition) console.log('Yes');

C. if condition: console.log('Yes');

D. if (condition) then { console.log('Yes'); }

Solution

1. Step 1: Recall JavaScript if syntax

   The condition must be inside parentheses, and the code block can be inside curly braces or a single statement without braces.

2. Step 2: Check each option

   if (condition) console.log('Yes'); correctly uses parentheses around the condition and a statement without braces.

3. Final Answer:

   if (condition) console.log('Yes'); -> Option B

4. Quick Check:

   Parentheses around condition = correct syntax [OK]

Hint: Condition must be in parentheses for if [OK]

Common Mistakes:

• Omitting parentheses around condition
• Using colons instead of braces
• Adding 'then' keyword (not in JS)

3. What will be the output of this code?

let x = 10;
if (x > 5) {
  console.log('Big');
} else {
  console.log('Small');
}

medium

A. Small

B. 10

C. Big

D. No output

Solution

1. Step 1: Evaluate the condition x > 5

   Since x is 10, which is greater than 5, the condition is true.

2. Step 2: Determine which block runs

   The if block runs and prints 'Big'. The else block is skipped.

3. Final Answer:

   Big -> Option C

4. Quick Check:

   10 > 5 is true, so output is 'Big' [OK]

Hint: Check if condition is true to pick output [OK]

Common Mistakes:

• Choosing else output when condition is true
• Confusing variable value with output
• Ignoring else block

4. Find the error in this code:

if x == 5 {
  console.log('Equal');
}

medium

A. Missing parentheses around condition

B. Using double equals instead of triple equals

C. Missing semicolon after console.log

D. Curly braces should be parentheses

Solution

1. Step 1: Check if statement syntax

   In JavaScript, the condition must be inside parentheses after if.

2. Step 2: Identify the error

   The code misses parentheses around x == 5, causing a syntax error.

3. Final Answer:

   Missing parentheses around condition -> Option A

4. Quick Check:

   Condition needs parentheses in if [OK]

Hint: Always put condition inside parentheses in if [OK]

Common Mistakes:

• Omitting parentheses around condition
• Confusing == and === (both valid but different)
• Thinking semicolon is mandatory after console.log

5. You want to print 'Adult' if age is 18 or more, otherwise 'Minor'. Which code correctly uses an if statement?

hard

A. if (age >= 18) { console.log('Adult'); } else { console.log('Minor'); }

B. if age >= 18 then { console.log('Adult'); } else { console.log('Minor'); }

C. if (age > 18) { console.log('Adult'); } else { console.log('Minor'); }

D. if (age = 18) { console.log('Adult'); } else { console.log('Minor'); }

Solution

1. Step 1: Check condition for age 18 or more

   The condition should be age >= 18 to include 18 and above.

2. Step 2: Verify syntax and logic

   if (age >= 18) { console.log('Adult'); } else { console.log('Minor'); } uses correct syntax and condition. if age >= 18 then { console.log('Adult'); } else { console.log('Minor'); } uses invalid 'then'. if (age > 18) { console.log('Adult'); } else { console.log('Minor'); } excludes age 18. if (age = 18) { console.log('Adult'); } else { console.log('Minor'); } uses assignment (=) instead of comparison (== or >=).

3. Final Answer:

   if (age >= 18) { console.log('Adult'); } else { console.log('Minor'); } -> Option A

4. Quick Check:

   Use >= and correct syntax for if-else [OK]

Hint: Use >= for 18 or more, no 'then' keyword [OK]

Common Mistakes:

• Using assignment (=) instead of comparison
• Using 'then' keyword (not in JS)
• Using > instead of >= to include 18