Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialNicholas Wallen
12,278 PointsCan someone explain this JavaScript code for me?
So I understand almost the entire code, except for the check answers section. I don't understand the logic behind the answers[i-1]. Can someone explain that to me?
function submitAnswers() { var total = 3; var score = 0;
//Get user input var q1 = document.forms['quizForm']['q1'].value; var q2 = document.forms['quizForm']['q2'].value; var q3 = document.forms['quizForm']['q3'].value;
// Validation
for(var i = 1; i <= total; i++) {
if(eval('q' + i) === null || eval('q' + i) == '' ) {
alert('You missed question ' + i);
return false;
}
}
// Set correct answers var answers = ["b","d","b"];
for(var i = 1; i <= total; i++) { // Check answers if (eval('q' + i) == answers[i - 1]) { score++; } }
1 Answer
Brendan Whiting
Front End Web Development Techdegree Graduate 84,736 PointsYou have variables q1
, q2
, q3
that are storing the result of someone's input to questions in a form. Then later on, you're in a for
loop, with the variable i
being used to store the current index in the loop starting at 1 going to 3. Inside the loop, this code eval('q' + i)
will evaluate 'q' + i each time in the loop which will be q1
, q2
, q3
. So when you evaluate that code, you'll get a reference to the user's answer in one of those variables, and then you're comparing it to the answer key - in the array answers
- to see if they match. But since arrays are 0-based in JavaScript you have to subtract 1 from i
for them to match. q1
is going to line up with answers[0]
.
A few recommendations:
- Using eval is not recommended for security purposes. In order to avoid using eval, one way of doing it would be to store the user's answers in an array as well (see below, the array
userInput
) - I also recommend starting your
for
loops withi
at 0. If you need to do any adjustments when because of the off-by-one issue, do the math before you display the number to the user rather than in the logic of your code. - If you're looping through an array, use the length of that array as the condition for your
for
loop to stop, rather than some hard-coded number (total
). If you add more questions to your program in the future, then it would still work with the new number automatically.
function submitAnswers() {
var score = 0;
// Get user input
var q1 = document.forms['quizForm']['q1'].value;
var q2 = document.forms['quizForm']['q2'].value;
var q3 = document.forms['quizForm']['q3'].value;
var userInput = [q1, q2, q3];
var answers = ["b","d","b"];
// Validation
for (var i = 0; i < userInput.length; i++) {
if (userInput[i] === null || userInput[i] === '') {
alert('You missed question ' + (i + 1));
return false;
}
}
// Set correct answers
for (var i = 0; i < userInput.length; i++) {
// Check answers
if (userInput[i] === answers[i]) {
score++;
}
}
}