displaying entire array instead of specific value.

Question

in displaying the result summary, I was expecting only the question part of the array to be shown, but in the actual results, it shows the entire array.

e.g.: expected: q1 actual: q1, a1

// 1. Create a multidimensional array to hold quiz questions and answers
const answerSheet = [
  [ 'q1', 'a1'],
  [ 'q2', 'a2'],
  [ 'q3', 'a3'],
  [ 'q4', 'a4'],
  [ 'q5', 'a5']
];

// 2. Store the number of questions answered correctly
const quizLength = answerSheet.length;
let correctAnswers = 0;
let answer = '';
let randomQuestion = '';
let randomNumber;
let correctQuestions = [];
let wrongQuestions = [];
let resultSummary;
/* 
  3. Use a loop to cycle through each question
      - Present each question to the user
      - Compare the user's response to answer in the array
      - If the response matches the answer, the number of correctly
        answered questions increments by 1
*/
for ( let i = quizLength; i > 0; i-- ) {

  randomNumber = Math.floor(Math.random() * answerSheet.length);
  randomQuestion = answerSheet.splice( randomNumber, 1 );
  answer = prompt( randomQuestion[0][0] );
  if ( answer.toUpperCase() === randomQuestion[0][1].toUpperCase() ) {
    correctAnswers++;
    correctQuestions.push( randomQuestion );
  } else { wrongQuestions.push( randomQuestion );
    }
}

// 4. Display the number of correct answers to the user
let main = document.querySelector('main')
  main.innerHTML = `<h1>You have ${correctAnswers} correct answers</h1>`;

resultSummary = `<h2>You got these questions right:</h2><ol>`;

for (let i = 0; i < correctQuestions.length; i++) {
  resultSummary += `<li>${correctQuestions[i][0]}</li>`;
}


resultSummary += `</ol><h2>You got these questions wrong:</h2><ol>`;

for (let i = 0; i < wrongQuestions.length; i++) {
  resultSummary += `<li>${wrongQuestions[i][0]}</li>`;
}

main.innerHTML += resultSummary + '</ol>';

Answer 1 · 2024-08-22T19:28:25Z

August 22, 2024 7:28pm

You're seeing it all because the code is pushing the entire array. Just push the first item (current question):

  if (answer.toUpperCase() === randomQuestion[0][1].toUpperCase()) {
    correctAnswers++;
    correctQuestions.push(randomQuestion[0]);   // push only the current question
  } else {
    wrongQuestions.push(randomQuestion[0]);     // push only the current question
  }

Answer 2 · 2024-08-26T01:06:05Z

August 26, 2024 1:06am

I see, in that line of code, I was expecting correctQuestions to take on the same structure of randomQuestion, but instead it seems to put the entire array of randomQuestion in the first element of correctAnswers. Maybe I should have used the spread operator to achieve the behavior I wanted.

Welcome to the Treehouse Community

Looking to learn something new?

Roy Cma

Roy Cma

displaying entire array instead of specific value.

2 Answers

Steven Parker

Steven Parker

Roy Cma

Roy Cma