Comparison operators in Javascript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to check if a is equal to b.

Javascript

if (a [1] b) {
  console.log("Equal");
}

Drag options to blanks, or click blank then click option'

A!=

B===

C>

D<

Attempts:

3 left

💡 Hint

Common Mistakes

Using '==' instead of '===' causes unexpected results.

Using '!=' instead of '==='.

The '===' operator checks if two values are equal and of the same type.

2fill in blank

medium

Complete the code to check if x is greater than 10.

Javascript

if (x [1] 10) {
  console.log("x is greater than 10");
}

Drag options to blanks, or click blank then click option'

A>

B<

C===

D<=

Attempts:

3 left

💡 Hint

Common Mistakes

Using '<' instead of '>' causes wrong condition.

Using '===' compares equality, not greater than.

The '>' operator checks if the left value is greater than the right value.

3fill in blank

hard

Fix the error in the comparison to check if num is not equal to 5.

Javascript

if (num [1] 5) {
  console.log("Not equal to 5");
}

Drag options to blanks, or click blank then click option'

A=

B===

C!==

D==

Attempts:

3 left

💡 Hint

Common Mistakes

Using '=' instead of '!=='.

Using '==' which checks equality, not inequality.

The '!==' operator checks if two values are not equal or not the same type.

4fill in blank

hard

Fill both blanks to check if age is between 18 and 30 (inclusive).

Javascript

if (age [1] 18 && age [2] 30) {
  console.log("Age is between 18 and 30");
}

Drag options to blanks, or click blank then click option'

A>=

B<

C<=

D>

Attempts:

3 left

💡 Hint

Common Mistakes

Using '>' instead of '>=' excludes 18.

Using '<' instead of '<=' excludes 30.

Use '>=' to check age is at least 18 and '<=' to check age is at most 30.

5fill in blank

hard

Fill all three blanks to create an object with keys as uppercase names and values as ages greater than 20.

Javascript

const result = people.reduce((acc, person) => {
  if (person.age [3] 20) {
    acc[[1]] = [2];
  }
  return acc;
}, {});

Drag options to blanks, or click blank then click option'

Aperson.name.toUpperCase()

Bperson.age

C>

Dperson.name

Attempts:

3 left

💡 Hint

Common Mistakes

Using '<' instead of '>' for age condition.

Using 'person.name' instead of uppercase.

Using wrong value for object property.

Use 'person.name.toUpperCase()' as key, 'person.age' as value, and '>' to check age greater than 20.

Practice

1. Which comparison operator checks if two values are equal in both value and type in JavaScript?

easy

A. !==

B. ==

C. !=

D. ===

Solution

1. Step 1: Understand equality operators

   == checks value equality but ignores type, while === checks both value and type.

2. Step 2: Identify strict equality operator

   === is the strict equality operator that compares both value and type.

3. Final Answer:

   === -> Option D

4. Quick Check:

   Strict equality = === [OK]

Hint: Use === to check value and type equality [OK]

Common Mistakes:

• Confusing == with ===
• Using != instead of !==
• Assuming == checks type

2. Which of the following is the correct syntax to check if variable a is NOT equal to variable b in both value and type?

easy

A. a !== b

B. a != b

C. a =! b

D. a !=== b

Solution

1. Step 1: Identify the strict inequality operator

   !== checks if two values are not equal in value or type.

2. Step 2: Check syntax correctness

   a !== b is correct syntax; others are either loose inequality or invalid.

3. Final Answer:

   a !== b -> Option A

4. Quick Check:

   Strict not equal = !== [OK]

Hint: Use !== for strict not equal check [OK]

Common Mistakes:

• Using != which ignores type
• Typing =! instead of !==
• Using too many equals signs

3. What will be the output of the following code?

console.log(5 == '5');
console.log(5 === '5');

medium

A. truetrue

B. truefalse

C. falsetrue

D. falsefalse

Solution

1. Step 1: Evaluate 5 == '5'

   Loose equality == converts types, so number 5 equals string '5', result is true.

2. Step 2: Evaluate 5 === '5'

   Strict equality === checks type too; number 5 is not string '5', result is false.

3. Final Answer:

   true
   false -> Option B

4. Quick Check:

   == true, === false [OK]

Hint: == compares value only; === compares value and type [OK]

Common Mistakes:

• Assuming both comparisons return true
• Confusing == and === behavior
• Ignoring type differences

4. Find the error in this code snippet:

if (a = 10) {
  console.log('Equal');
} else {
  console.log('Not equal');
}

medium

A. Variable a is not declared

B. Should use == instead of =

C. Should use === instead of =

D. No error, code is correct

Solution

1. Step 1: Identify assignment vs comparison

   = assigns value 10 to a, not compares it.

2. Step 2: Use strict equality for comparison

   Replace = with === to compare value and type correctly.

3. Final Answer:

   Should use === instead of = -> Option C

4. Quick Check:

   Use === for comparison, not = [OK]

Hint: Use === for comparison, = is assignment [OK]

Common Mistakes:

• Using = instead of == or ===
• Ignoring variable declaration
• Assuming no error in if condition

5. You want to check if a variable score is between 50 and 100 inclusive. Which expression correctly uses comparison operators to do this?

hard

A. score >= 50 && score <= 100

B. 50 <= score <= 100

C. score > 50 || score < 100

D. score == 50 && score == 100

Solution

1. Step 1: Understand range checking in JavaScript

   JavaScript does not support chained comparisons like 50 <= score <= 100 as in math.

2. Step 2: Use logical AND with two comparisons

   Use score >= 50 && score <= 100 to check both conditions separately.

3. Final Answer:

   score >= 50 && score <= 100 -> Option A

4. Quick Check:

   Use && with two comparisons for range [OK]

Hint: Use && with two comparisons for ranges [OK]

Common Mistakes:

• Using chained comparisons like 50 <= score <= 100
• Using || instead of &&
• Checking equality to both ends simultaneously