Trying to re-write JS quiz using arrays & loops -- where do the correct answers go?

Question

I wrote a miniature JS quiz before I learned what loops and arrays are, and now I'm trying to tidy it up a bit. The original quiz asks users questions in an alert window, and if they answer incorrectly, it tells them what the correct answer is. If the answer is correct, it tells them they are correct, before proceeding to the next question. It also keeps a tally of how many answers the user gets right or wrong. Here is my original (excessive) code:

var correct = 0;

var answer1 = prompt("What is the capital of England?");
  if (answer1.toUpperCase() === "LONDON") {
    alert("That's correct!")
    correct += 1
  }
  else {
    alert("False. The correct answer is London.")
  }

var answer2 = prompt("What is the capital of France?")
   if (answer1.toUpperCase() === "PARIS") {
    alert("That's correct!")
    correct += 1
  }
  else {
    alert("False. The correct answer is Paris.");
  }

var answer3 = prompt("What is the capital of Canada?")
  if (answer3.toUpperCase() === "OTTAWA") {
    alert("That's correct!");
    correct += 1
  }
  else {
    alert("False. The correct answer is Ottawa.");
  }

document.write("<h1>You answered " + correct + " out of 5 questions correctly.</h1>")

if (correct === 5) {
  document.write("You won a gold star!");
}
  else if (correct >= 3) {
  document.write("You won a silver star.");
}

  else if (correct >= 2) {
  document.write ("You win third place.");
}

else {
  document.write("Sadly, you did not win any stars.");
}

As you can see this is very long and noobish. Here is the re-write I've been working on:

var questions = [
["What is the capital of England?", "LONDON"]
["What is the capital of France?", "PARIS"]
["What is the capital of Canada?", "OTTAWA"]
]

var correctAnswers = 0; 

for (var i = 0; i < questions.length ; i += 1 ) {
question = questions[i][0];
answer = questions[i][1];
response = prompt(question);
response = toUpperCase(response);
if response === answer {
correctAnswers += 1;
}

Where I'm getting a little lost is the structure and placement of the correct answers which are shown to the user by the quiz in an alert window if they answer incorrectly. Would I need to add a third column to the 2 dimensional array and then reference it in the for loop i.e. correctResponse = [i][2]? Or is there an entirely different way I should go about this?

I know this is just a learning phase for you, but i hope you know you should never store answers or anything valuable in javascript on the client side. — Satej S
– Satej S, Commented May 5, 2016 at 4:38

Keatinge · Accepted Answer · 2016-05-05 05:00:05Z

1

You're just missing some commas and your array got messed up. You don't need to complicate the structure of your array anymore. You didn't have commas between your individual array items though.

Essentially you loop through the full array and for each subitem you print out questions[i][0] for the question and questions[i][1] for the answer

var questions = [
["What is the capital of England?", "LONDON"],
["What is the capital of France?", "PARIS"],
["What is the capital of Canada?", "OTTAWA"]
];

var correctAnswers = 0;

for (var i = 0; i < questions.length; i++) {
    var answer = prompt(questions[i][0]);
    if (answer.toUpperCase() == questions[i][1]) {
        alert("Correct!");
        correctAnswers++;
    }
    else {
        alert("incorrect, the correct answer was " + questions[i][1]);
    }
}

Example with custom responses if they get the question right: You just add another item to each question array, and only display that item if they get the question right.

var questions = [
["What is the capital of England?", "LONDON", "You know, where the queen lives"],
["What is the capital of France?", "PARIS", "Remember the eiffel tower?"],
["What is the capital of Canada?", "OTTAWA", "Lot of mooses there"]
];

var correctAnswers = 0;

for (var i = 0; i < questions.length; i++) {
    var answer = prompt(questions[i][0]);
    if (answer.toUpperCase() == questions[i][1]) {
        alert("Correct! " + questions[i][2]);
        correctAnswers++;
    }
    else {
        alert("incorrect, the correct answer was " + questions[i][1]);
    }
}

edited May 5, 2016 at 5:00

answered May 5, 2016 at 4:38

Keatinge

4,3616 gold badges28 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

JSJunkie Over a year ago

Thank you! Do you know how would I add a unique alert for each individual question? i.e. "The correct answer is London. You know, where the Queen lives."

Keatinge Over a year ago

Yeah sure, i'll post an example in a few minutes

Keatinge Over a year ago

@JSJunkie There, I posted an example where if they get it right it will show a custom message for each question

JSJunkie Over a year ago

Thanks so much for the help!

JSJunkie Over a year ago

So sorry to bother you again but if I wanted to add another question with a numerical answer (i.e. "What is the capital of Thailand?"), where would I factor in the parsInt? Would I have to create a second if statement? i.e. if (parseInt[4][1] === 67000000) { alert("That's correct!"); correct += 1 }?

|

Collectives™ on Stack Overflow

Trying to re-write JS quiz using arrays & loops -- where do the correct answers go?

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related