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 trial

JavaScript JavaScript Arrays Multidimensional Arrays Improve the Quiz – One Solution

Samuel Kleos
seal-mask
.a{fill-rule:evenodd;}techdegree
Samuel Kleos
Front End Web Development Techdegree Student 12,719 Points

I'm done with the challenge, but I just can't seem to get rid of the 'undefined'. See my snapshot.

At the top of my ordered lists in the browser I keep seeing 'Undefined' show up on the list. Here's the snapshot: https://w.trhou.se/9l65r4x6vk

let questions = [
    ["How many stars in the galaxy", '1'],
    ["What's my mums name?", "frank"],
    ["How much of a dum dum are you out of 10?", '10']
];

// 2. Store the number of questions answered correctly
let correct_answers = 0;
let questions_passed = [];
let questions_failed = [];

/* 
  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 = 0; i < questions.length; i++ ) {
    let guess = prompt(`Hi there, ${questions[i][0]}`);
    let answer = questions[i][1]

    if ( guess === answer ) {
        alert("Correctamundo!");
        correct_answers++;
        questions_passed.push(questions[i][0]);
    } else {
        alert("Sorry that's incorrect. Moving on...");
        questions_failed.push(questions[i][0]);
    }

    document.querySelector('main').innerHTML = createOl(questions_failed);
}
function createOl(arr) {
    let ordered_list;
    for ( let i = 0; i < arr.length; i++ ) {
        ordered_list += `<li>${arr[i]}</li>`;
    }
    return ordered_list;
}

// 4. Display the number of correct answers to the user
document.querySelector('main').innerHTML = `
    <h1>Congratulations! You got ${correct_answers} correct!</h1>
    <h2>Questions you got right. :)</h2>
    <ol>${createOl(questions_passed)}</ol>
    <h2>Questions you got wrong. :(</h2>
    <ol>${createOl(questions_failed)}</ol>
`;

1 Answer

Steven Parker
Steven Parker
229,787 Points

Creating, but not assigning, a new variable (as on line 36) gives it initial contents of "undefined". And the concatenating assignment operator ( += , used on line 38) doesn't alter the current contents, but adds more on. So the string will always begin with "undefined".

But the solution is simple, just assign an empty string ( "" ) to the variable when it is created.