JavaScript JavaScript Loops, Arrays and Objects Tracking Data Using Objects The Build an Object Challenge, Part 2 Solution

Why is undefined printing at the top of my page?

When I preview the code, everything from the challenge works, but undefined is printed at the top of my page. I can't figure out why this is happening and what I can do to prevent it. Thanks for the help!

let students = [ // five students { name: 'Chandler', track: 'Front End Development', achievements: 222, points: 2100, }, { name: 'Tom', track: 'Web Design', achievements: 432, points: 2000, }, { name: 'Nick', track: 'Front End Development', achievements: 333, points: 3200, }, { name: 'Kevin', track: 'Ruby on Rails', achievements: 400, points: 5000, }, { name: 'Devin', track: 'PHP Development', achievements: 221, points: 1200, }, ];

let message; let student;

for (let i =0; i < students.length; i++) { student = students[i]; message += <h2>Student: ${}</h2> <p>Track: ${student.track}</p> <p>Achievements: ${student.achievements}</p> <p>Points: ${student.points}</p> ; } document.getElementById('output').innerHTML = message;

1 Answer

By using message += the first time through the loop you are concatenating with the initial value of message . Since message is declared without a value the initial value is undefined. To fix use let message = ''.

Ah, thank you so much! Makes total sense.