Why error handling is required in Javascript - Test Your Understanding

Practice - 5 Tasks

1fill in blank

easy

Complete the code to catch errors using try-catch.

Javascript

try {
  console.log('Start');
  [1]
  console.log('End');
} catch (error) {
  console.log('Error caught');
}

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

Abreak

Bconsole.log('No error')

Creturn 'Done'

Dthrow new Error('Oops!')

Attempts:

3 left

💡 Hint

Common Mistakes

Using console.log instead of throw to create an error.

The throw statement creates an error that is caught by catch.

2fill in blank

medium

Complete the code to handle errors and show a message.

Javascript

function divide(a, b) {
  try {
    if (b === 0) {
      [1]
    }
    return a / b;
  } catch (e) {
    return e.message;
  }
}

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

Areturn 'Error'

Bthrow new Error('Cannot divide by zero')

Cbreak

Dconsole.log('Divide by zero')

Attempts:

3 left

💡 Hint

Common Mistakes

Using console.log instead of throw to signal an error.

Throwing an error with a message lets the catch block handle it properly.

3fill in blank

hard

Fix the error in the code to properly catch exceptions.

Javascript

try {
  JSON.parse('invalid json');
} [1] (e) {
  console.log('Parsing failed');
}

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

Acatch

Berror

Cfinally

Dthrow

Attempts:

3 left

💡 Hint

Common Mistakes

Using error or finally instead of catch.

The catch keyword is required to catch errors thrown in try.

4fill in blank

hard

Fill both blanks to handle errors and always run cleanup code.

Javascript

try {
  let data = JSON.parse(input);
  process(data);
} [1] (err) {
  console.error('Error:', err.message);
} [2] {
  console.log('Cleanup done');
}

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

Acatch

Bfinally

Cthrow

Derror

Attempts:

3 left

💡 Hint

Common Mistakes

Using throw or error keywords incorrectly.

catch handles errors, finally runs code regardless of errors.

5fill in blank

hard

Fill all three blanks to create a function that safely parses JSON and returns null on error.

Javascript

function safeParse(jsonString) {
  try {
    return [1](jsonString);
  } [2] (e) {
    console.warn('Invalid JSON');
    return [3];
  }
}

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

AJSON.parse

Bcatch

Cnull

Dthrow

Attempts:

3 left

💡 Hint

Common Mistakes

Using throw inside catch instead of returning null.

The function tries to parse JSON. If it fails, catch runs and returns null.

Practice

1. Why is error handling important in JavaScript programs?

easy

A. It helps the program continue running even if an error occurs.

B. It makes the program run faster.

C. It removes all bugs automatically.

D. It changes the program's logic.

Solution

1. Step 1: Understand the role of error handling

   Error handling is used to manage unexpected problems during program execution.

2. Step 2: Identify the benefit of error handling

   It allows the program to keep running smoothly instead of crashing.

3. Final Answer:

   It helps the program continue running even if an error occurs. -> Option A

4. Quick Check:

   Error handling = program continues [OK]

Hint: Error handling keeps programs running without crashing [OK]

Common Mistakes:

• Thinking error handling speeds up code
• Believing it fixes bugs automatically
• Confusing error handling with changing logic

2. Which of the following is the correct syntax to catch errors in JavaScript?

easy

A. try { /* code */ } error (catch) { /* handle error */ }

B. catch { /* code */ } try (error) { /* handle error */ }

C. try (error) { /* code */ } catch { /* handle error */ }

D. try { /* code */ } catch (error) { /* handle error */ }

Solution

1. Step 1: Recall JavaScript error handling syntax

   The correct syntax uses try block followed by catch with an error parameter.

2. Step 2: Match syntax with options

   try { /* code */ } catch (error) { /* handle error */ } matches the correct structure: try { } catch (error) { }.

3. Final Answer:

   try { /* code */ } catch (error) { /* handle error */ } -> Option D

4. Quick Check:

   try-catch syntax = try { /* code */ } catch (error) { /* handle error */ } [OK]

Hint: Remember: try then catch(error) to handle exceptions [OK]

Common Mistakes:

• Swapping try and catch keywords
• Omitting error parameter in catch
• Using incorrect parentheses placement

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

try {
  console.log('Start');
  throw new Error('Oops');
  console.log('End');
} catch (e) {
  console.log('Caught:', e.message);
}

medium

A. Start\nCaught: Oops

B. Caught: Oops

C. Start\nEnd

D. Start\nError: Oops

Solution

1. Step 1: Trace code execution inside try block

   It prints 'Start', then throws an error, so 'End' is skipped.

2. Step 2: Understand catch block behavior

   The catch block runs and prints 'Caught: Oops' using the error message.

3. Final Answer:

   Start\nCaught: Oops -> Option A

4. Quick Check:

   Throw stops try, catch prints error message [OK]

Hint: Throw stops try; catch handles error message [OK]

Common Mistakes:

• Expecting code after throw to run
• Missing error message in catch output
• Confusing catch block with finally

4. Identify the error in this code snippet:

try {
  let result = 10 / 0;
  console.log(result);
} catch {
  console.log('Error caught');
}

medium

A. Division by zero causes a crash

B. try block syntax is incorrect

C. Missing error parameter in catch block

D. console.log is not allowed inside try

Solution

1. Step 1: Check catch block syntax

   In JavaScript, catch should have an error parameter like catch(error) to work properly.

2. Step 2: Understand division by zero behavior

   Division by zero returns Infinity, not an error, so no exception is thrown.

3. Final Answer:

   Missing error parameter in catch block -> Option C

4. Quick Check:

   catch needs error parameter [OK]

Hint: Always include error parameter in catch (e) [OK]

Common Mistakes:

• Assuming division by zero throws error
• Omitting error parameter in catch
• Thinking console.log causes error

5. You want to make a function that reads a JSON string and returns an object. If the JSON is invalid, it should return null without crashing. Which code correctly handles this?

hard

A. function parseJson(str) {
return JSON.parse(str);
}

B. function parseJson(str) {
try {
return JSON.parse(str);
} catch (e) {
return null;
}
}

C. function parseJson(str) {
if (typeof str === 'object') return str;
else return null;
}

D. function parseJson(str) {
return JSON.stringify(str);
}

Solution

1. Step 1: Understand JSON.parse behavior

   JSON.parse throws an error if the string is invalid JSON.

2. Step 2: Use try-catch to handle errors safely

   Wrapping JSON.parse in try-catch lets us catch errors and return null instead of crashing.

3. Final Answer:

   function parseJson(str) { try { return JSON.parse(str); } catch (e) { return null; } } -> Option B

4. Quick Check:

   try-catch safely parses JSON or returns null [OK]

Hint: Wrap JSON.parse in try-catch to avoid crashes [OK]

Common Mistakes:

• Not catching JSON.parse errors
• Returning wrong type on error
• Confusing JSON.stringify with parse