Throwing errors in Javascript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to throw a new error with the message "Oops!".

Javascript

throw new [1]("Oops!");

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

AError

BException

CMessage

Dthrow

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'throw' as a type instead of a keyword.

Using 'Exception' which is not a built-in JavaScript error type.

Using 'Message' which is not an error type.

In JavaScript, to throw an error you use the Error constructor with the message inside parentheses.

2fill in blank

medium

Complete the code to throw a TypeError with the message "Invalid type".

Javascript

throw new [1]("Invalid type");

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

AError

BSyntaxError

CTypeError

DReferenceError

Attempts:

3 left

💡 Hint

Common Mistakes

Using SyntaxError which is for syntax issues.

Using ReferenceError which is for undefined variables.

Using generic Error instead of TypeError.

TypeError is a built-in JavaScript error type used to indicate a type mismatch.

3fill in blank

hard

Fix the error in the code to correctly throw a RangeError with message "Out of range".

Javascript

throw [1]("Out of range");

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

ARangeError

Bnew RangeError

Cnew Error

DError

Attempts:

3 left

💡 Hint

Common Mistakes

Omitting the 'new' keyword causes a TypeError.

Using just the error type without 'new' is incorrect.

Using generic Error instead of RangeError.

To throw an error object, you must use the 'new' keyword before the error type.

4fill in blank

hard

Fill both blanks to throw a SyntaxError with message "Syntax is wrong".

Javascript

throw [1]([2]);

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

Anew SyntaxError

B"Syntax is wrong"

CSyntaxError

D'Syntax is wrong'

Attempts:

3 left

💡 Hint

Common Mistakes

Not using 'new' before the error type.

Passing the message without quotes.

Using the error type without 'new'.

You must use 'new' to create the error object and pass the message as a string in quotes.

5fill in blank

hard

Fill both blanks to throw a ReferenceError with message "Variable not found".

Javascript

throw [1]([2]);

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

AReferenceError

B"Variable not found"

Cnew ReferenceError

D'Variable not found'

Attempts:

3 left

💡 Hint

Common Mistakes

Omitting 'new' keyword.

Passing message without quotes.

Using wrong error type.

You create a new ReferenceError object with 'new', pass the message as a string, and the error type is ReferenceError.

Practice

1. What does the throw statement do in JavaScript?

easy

A. Stops the program and creates an error.

B. Catches an error and handles it.

C. Declares a new variable.

D. Runs a function asynchronously.

Solution

1. Step 1: Understand the purpose of throw

   The throw statement is used to create an error and stop normal program execution.

2. Step 2: Differentiate from error handling

   Unlike try...catch which handles errors, throw actually creates the error.

3. Final Answer:

   Stops the program and creates an error. -> Option A

4. Quick Check:

   throw creates error = A [OK]

Hint: Remember: throw creates errors, try...catch handles them [OK]

Common Mistakes:

• Confusing throw with try...catch
• Thinking throw handles errors
• Believing throw declares variables

2. Which of the following is the correct syntax to throw a new error with the message "Invalid input"?

easy

A. throw 'Invalid input';

B. throw error('Invalid input');

C. throw new Error('Invalid input');

D. throw new error('Invalid input');

Solution

1. Step 1: Recall the correct Error constructor usage

   In JavaScript, to create an error object, use new Error('message').

2. Step 2: Check syntax correctness

   Only throw new Error('Invalid input'); uses throw new Error('Invalid input'); which is correct syntax.

3. Final Answer:

   throw new Error('Invalid input'); -> Option C

4. Quick Check:

   Correct syntax uses new Error = C [OK]

Hint: Always use 'throw new Error' with capital E [OK]

Common Mistakes:

• Missing 'new' keyword
• Using lowercase 'error' instead of 'Error'
• Omitting parentheses

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

try {
  throw new Error('Oops!');
} catch (e) {
  console.log(e.message);
}

medium

A. Oops!

B. Error: Oops!

C. undefined

D. No output

Solution

1. Step 1: Understand the throw and catch behavior

   The code throws an error with message 'Oops!'. The catch block catches it and logs e.message.

2. Step 2: Determine what e.message contains

   e.message is the string 'Oops!'. So console.log(e.message) prints 'Oops!'.

3. Final Answer:

   Oops! -> Option A

4. Quick Check:

   Logging error message prints 'Oops!' = A [OK]

Hint: Catch error and log e.message to see the message [OK]

Common Mistakes:

• Printing whole error object instead of message
• Expecting 'Error: Oops!' instead of just message
• Thinking no output occurs

4. Identify the error in this code snippet:

try {
  throw new Error('Fail');
} catch e {
  console.log(e.message);
}

medium

A. Incorrect use of throw keyword.

B. No error; code runs fine.

C. Error message string is invalid.

D. Missing parentheses around catch parameter.

Solution

1. Step 1: Check catch syntax

   In JavaScript, the catch block must have parentheses around the error parameter, like catch (e).

2. Step 2: Identify the syntax error

   The code uses catch e without parentheses, which causes a syntax error.

3. Final Answer:

   Missing parentheses around catch parameter. -> Option D

4. Quick Check:

   Catch parameter needs parentheses = B [OK]

Hint: Always write catch with parentheses: catch (e) [OK]

Common Mistakes:

• Omitting parentheses in catch
• Misplacing throw statement
• Confusing error message with syntax error

5. You want to throw an error only if a user input is empty or null. Which code correctly throws an error in this case?

hard

A. if (input) throw new Error('Input required');

B. if (!input) throw new Error('Input required');

C. if (input == null) throw new error('Input required');

D. if (input === '') throw Error('Input required');

Solution

1. Step 1: Understand falsy values for empty or null input

   In JavaScript, !input is true if input is null, undefined, empty string, 0, or false.

2. Step 2: Check which option correctly throws error for empty or null

   if (!input) throw new Error('Input required'); uses if (!input) throw new Error('Input required'); which covers empty string and null correctly with proper syntax.

3. Final Answer:

   if (!input) throw new Error('Input required'); -> Option B

4. Quick Check:

   Use !input to check empty/null and throw Error = D [OK]

Hint: Use if (!input) to catch empty or null inputs [OK]

Common Mistakes:

• Using lowercase 'error' instead of 'Error'
• Throwing error only for empty string but missing null
• Throwing error when input is valid