- Help to create my simple JavaScript quiz?

Question

I'm trying to create an environmentally friendly quiz for kids to take part in as part of my school work. The quiz is supposed to be 6 questions and for every question they answer correct they receive one point, for any question they get wrong their points will just stay the same.

My code is not working currently and I cannot figure out why. I was wondering if I could get some honest input as to how other people would structure this differently or any tips to help me improve. Thanks

function quiz() {

let score = 0

var ques1 = prompt("Which of these can you NOT recycle? \nA - Glass\nB - Paper\nC - Pens and pencils\nAnswer: ")
alert("The answer you have selected is " + ques1);

if (ques1 === "C"); {
  (score === +1);
  alert("Your answer is correct. Your score is currently " + score);
} else {
  (score === 0);
  alert("Your answer is not correct")
}

var ques2 = prompt("Which colour bin does paper and cardboard go in? \nA - Blue\nB - Green\nC - Yellow\nAnswer: ")
alert("The answer you have selected is " + ques2);

if (ques2 === "A"); {
  (score === +1);
  alert("Your answer is correct. Your score is currently " + score);
} else {
  (score === -1);
  alert("Your answer is not correct")
}

var ques3 = prompt("Which type of transport is best for the environment? \nA - Bus\nB - Car\nC - Bike\nAnswer:")
alert("The answer you have selected is " + ques3);

if (ques3 === "C"); {
  (score === +1);
  alert("Your answer is correct. Your score is currently " + score);
} else {
  (score === -1);
  alert("Your answer is not correct")
}

var ques4 = prompt("What is deforestation? \nA - The loss of trees\nB - The loss of clouds\nC - The loss of water\nAnswer:")
alert("The answer you have selected is " + ques4);

if (ques4 === "A"); {
  (score === +1);
  alert("Your answer is correct. Your score is currently " + score);
} else {
  (score === -1);
  alert("Your answer is not correct.")
}

var ques5 = prompt("Which of these is a type of green energy? \nA - Petrol\nB - Wind\nC - Wood\nAnswer:")
alert("The answer you have selected is " + ques5);

if (ques5 === "B"); {
  (score === +1);
  alert("Your answer is correct. Your score is currently " + score);
} else {
  (score === -1);
  alert("Your answer is not correct.")
}

var ques6 = prompt("When you go to the shop, it's best to... \nA - Buy a paper bag\nB - Buy a plastic bag\nC - Bring your re-usable bag from home\nAnswer:")
alert("The answer you have selected is " + ques6);

if (ques6 === "C"); {
  (score === +1);
  alert("Your answer is correct. Your score is currently " + score);
} else {
  (score === -1);
  alert("Your answer is not correct.")
}

if (score >= 3); {
  alert("You have passed " + score);
}
  else {
    alert("You did not pass " + score)
  }


}

Answer 1

You seem to be very new at JavaScript. In an if statement, you don't need ;. (score === +1) isn't a thing, score++ is. and you wrapped your code in a function which you didn't call. i have edited your code, and it's now working for me. here it is:

JavaScript:

let score = 0

var ques1 = prompt("Which of these can you NOT recycle? \nA - Glass\nB - Paper\nC - Pens and pencils\nAnswer: ")
alert("The answer you have selected is " + ques1);

if (ques1 === "C" || ques1 === "c" {
  score++;
  alert("Your answer is correct. Your score is currently " + score);
} else {
  score = 0;
  alert("Your answer is not correct");
}

var ques2 = prompt("Which colour bin does paper and cardboard go in? \nA - Blue\nB - Green\nC - Yellow\nAnswer: ")
alert("The answer you have selected is " + ques2);

if (ques2 === "A" || ques2 === "a") {
  score++;
  alert("Your answer is correct. Your score is currently " + score);
} else {
  score--;
  alert("Your answer is not correct")
}

var ques3 = prompt("Which type of transport is best for the environment? \nA - Bus\nB - Car\nC - Bike\nAnswer:")
alert("The answer you have selected is " + ques3);

if (ques3 === "C" || ques3 === "c") {
  score++;
  alert("Your answer is correct. Your score is currently " + score);
} else {
  score--;
  alert("Your answer is not correct")
}

var ques4 = prompt("What is deforestation? \nA - The loss of trees\nB - The loss of clouds\nC - The loss of water\nAnswer:")
alert("The answer you have selected is " + ques4);

if (ques4 === "A" || ques4 === "a") {
  score++;
  alert("Your answer is correct. Your score is currently " + score);
} else {
  score--;
  alert("Your answer is not correct.")
}

var ques5 = prompt("Which of these is a type of green energy? \nA - Petrol\nB - Wind\nC - Wood\nAnswer:")
alert("The answer you have selected is " + ques5);

if (ques5 === "B" || ques5 === "b") {
  score++;
  alert("Your answer is correct. Your score is currently " + score);
} else {
  score--;
  alert("Your answer is not correct.")
}

var ques6 = prompt("When you go to the shop, it's best to... \nA - Buy a paper bag\nB - Buy a plastic bag\nC - Bring your re-usable bag from home\nAnswer:")
alert("The answer you have selected is " + ques6);

if (ques6 === "C" || ques6 === "c") {
  score++;
  alert("Your answer is correct. Your score is currently " + score);
} else {
  score--
  alert("Your answer is not correct.")
}

if (score >= 3) {
  alert("You have passed with a score of " + score);
} else {
  alert("You did not pass with a score of " + score)
}

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="script.js" defer></script>
</head>
<body>
  
</body>
</html>

you should call your JavaScript file script.js, and put it in the same folder as the HTML file. Otherwise the script tag won't work, and your JavaScript will not run.

You also said, that if they answer a question wrong, that the points should stay the same. if that's what you want, you can just delete all the score--'s. "score--" is the same as "score = score - 1"

I have also edited your code, so that the answer is also correct if the user fills in a lowercase letter. "||" means "or" in JavaScript.

Answer 2

Tried this - Hope it helps :) - https://codepen.io/KZJ/pen/LYQYryp

Only made minor syntax corrections to your code:

1. Changed score calculation from Comparison operator == to Assignment operator = [Further Reading: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators ]
2. Removed semi-colon after the if statements
3. Called the quiz function quiz();
4. Added case insensitive comparison

Note: Also commented all the negative marking clauses since it was mentioned in the question.

Answer 3

The other two answers here seem to have covered the mistakes in the code, I though I'd point out that you might be able to make things a bit easier to add and edit questions by doing a small amount of refactoring:

const questions = [
  { question: "Which of these can you NOT recycle? \nA - Glass\nB - Paper\nC - Pens and pencils", answer: 'C' },
  { question: "Which colour bin does paper and cardboard go in? \nA - Blue\nB - Green\nC - Yellow", answer: 'A' },
  { question: "Which type of transport is best for the environment? \nA - Bus\nB - Car\nC - Bike", answer: 'C' },
  { question: "What is deforestation? \nA - The loss of trees\nB - The loss of clouds\nC - The loss of water", answer: 'A' },
  { question: "Which of these is a type of green energy? \nA - Petrol\nB - Wind\nC - Wood", answer: 'B' },
  { question: "When you go to the shop, it's best to... \nA - Buy a paper bag\nB - Buy a plastic bag\nC - Bring your re-usable bag from home", answer: 'C' },
];

function quiz() {
  let score = 0;
  
  questions.forEach((question) => {
    let answer = prompt(question.question + "\nAnswer: ");
    
    if (answer.toUpperCase() === question.answer) {
      score += 1;
      alert("Your answer is correct. Your score is currently " + score);
    } else {
      // score -= 1;
      alert("Your answer is not correct");
    }
  });

  if (score >= 3) {
    alert("You have passed " + score);
  } else {
    alert("You did not pass " + score)
  }
}

quiz();