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

David Pinner
David Pinner
7,039 Points

have a look at my code, I've tried to use some ES6 and a different way to add the message

const students = [ { name: 'John', track: 'FullStack Developer', achievements: 20, points: 200 }, { name: 'Kate', track: 'ios', achievements: 60, points: 1000 }, { name: 'Alex', track: 'Javascript', achievements: 10, points: 20 }, { name: 'Jenifer', track: 'Front End Development', achievements: 45, points: 600 }, { name: 'Bob', track: 'BackEnd Development', achievements: 80, points: 2000 } ];

function printStudent(message) { document.getElementById('listAns').innerHTML = message; }

let mess = ''; let student;

for(let i = 0; i < students.length; i++) {
        mess +=  ` <br>
                    <table>
                        <tr>
                            <td style="font-weight: bold">Name: ${students[i].name}</td>
                        </tr>
                        <tr>
                            <td>Track: ${students[i].track}</td>
                        </tr>
                        <tr>
                            <td>Achievements: ${students[i].achievements}</td>
                        </tr>
                        <tr>
                            <td>points: ${students[i].points}</td>
                        </tr>
                    </table>
                `;
    }

printStudent(mess);

1 Answer

Steven Parker
Steven Parker
203,729 Points

Good use of the template string feature! I noticed that you declared (but didn't use) a "student" variable, but using it might be a nice way to make the template string a bit more compact:

for (let student of students) {
    mess += `<br>
             <table>
                 <tr><td style="font-weight: bold">Name: ${student.name}</td></tr>
                 <tr><td>Track: ${student.track}</td></tr>
                 <tr><td>Achievements: ${student.achievements}</td></tr>
                 <tr><td>Points: ${student.points}</td></tr>
             </table>`;
}