JavaScript Essentials 1

Overview and Objectives

In this project, you will create a Simple Interactive Quiz Application using JavaScript. This application will:

• Prompt the user for their name.
• Present a series of quiz questions to the user using prompt().
• Use loops and conditional statements to iterate through questions and evaluate responses.
• Use functions to encapsulate quiz logic (e.g., to ask a question, validate input, and calculate the score).
• Handle invalid input gracefully using error handling techniques.
• Output the final score and a personalized message using alert() or console.log().

This project integrates all the key concepts from the module and prepares you for more advanced topics.

Tasks and Instructions

Task 1: Setup and Greeting

1. Create Files:

   • Create a file named quizApp.js.

2. User Greeting:

   • Prompt the user to enter their name and store it in a variable.
   • Display a welcome message that includes the user’s name.

Task 2: Quiz Questions and Logic

1. Define Quiz Data:

   • Create an array of at least 5 quiz questions.
   • Each quiz question can be an object with properties like question and answer. For example:

     const quizQuestions = [
       { question: "What is the file extension for JavaScript files?", answer: ".js" },
       { question: "Which keyword is used to declare a block-scoped variable?", answer: "let" },
       // Add more questions...
     ];

2. Function Implementation:

   • Write a function askQuestion(questionObj) that:
     • Uses prompt() to display the question to the user.
     • Captures the user’s answer and compares it (case-insensitive) to the correct answer.
     • Returns true if the answer is correct and false otherwise.
   • Write another function runQuiz() that:
     • Iterates through the quizQuestions array using a loop.
     • Calls askQuestion() for each question.
     • Maintains a score counter that increments for each correct answer.
     • Returns or displays the total score at the end.

Task 3: Error Handling and Input Validation

1. Input Validation:
   • Ensure that when using prompt(), if the user enters an empty value, the program prompts again or treats it as incorrect.
2. Exception Handling:
   • Use try...catch around parts of the code where errors might occur (e.g., converting input) to prevent the application from crashing.
   • Display a user-friendly error message if an unexpected error occurs.

Task 4: Final Output

1. Display Score:
   • After all questions have been answered, display the final score along with a personalized message (e.g., “Great job, [Name]! You scored X out of Y.”).
2. Enhancement:
   • Allow the user to retake the quiz by asking if they want to play again, and repeat the process if they agree.

Submission Criteria

The following should be included within a GitHub repository, and submitted via Canvas:

• Files/Links:

  • Submit the quizApp.js file.
  • If applicable, provide a link to an online editor project (e.g., CodePen, JSFiddle).

• Evidence of Output:

  • Provide screenshots or a text log demonstrating the quiz execution (showing the greeting, question prompts, and final score output).

• Error-Free Code:

  • The code should execute without runtime errors and meet the functionality described above.

Grading Rubric

Total Points: 100 points