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 Loops, Arrays and Objects Tracking Data Using Objects The Build an Object Challenge, Part 2 Solution

Carlo Sabogal
Carlo Sabogal
7,468 Points

why does he use message = ' ' at the beginning?

Please explain why is necessary to add message =' ' at the beginning, first time I see him doing that. Why if I remove it, and down in the loop i use message = '<h2>Student: ' + student.Name + '</h2>'; instead of message += '<h2>Student: ' + student.Name + '</h2>'; only lists the last student?

Thanks

1 Answer

I will answer your questions in reverse order since one follows from the other.

When you go:

message = 'Student: ' + student.Name + ''; 

Each time this line runs, the content of the message variable gets replaced by the new content.

Using += instead adds the new content to the end of the string which is already stored in the message variable. For example:

var message = 'h'; // 'h'
message += 'e';    // 'he'
message += 'llo';  // 'hello'

To use +=, the message variable must contain something which can be added to. This is why the value of message is initialized to be an empty string ( '' ). Without it, the first += wouldn't work since undefined + 'any string' results in "undefinedany string", which is not what you want.

Carlo Sabogal
Carlo Sabogal
7,468 Points

I understand that, what I don't understand is why the code doesn't show all the records if I remove the var message from the top of the page and instead add it in the function...like this:

for (var i = 0; i < students.length; i += 1) { student = students[i]; var message = '<h2>Student: ' + student.name + '</h2>'; message += '<p>Track: ' + student.track + '</p>'; message += '<p>Points: ' + student.points + '</p>'; message += '<p>Achievements: ' + student.achievements + '</p>'; }

thanks

Here is your code in a formatted code block to make it easier to see.

for (var i = 0; i < students.length; i += 1) {
  student = students[i];
  var message = 'Student: ' + student.name + '';
  message += 'Track: ' + student.track + '';
  message += 'Points: ' + student.points + '';
  message += 'Achievements: ' + student.achievements + '';
}

Every time the loop runs, it reassigns the message variable in this line:

  var message = 'Student: ' + student.name + '';

So, the first time, it builds up a string for the first student in the variable message and then it goes back to the top of the loop and replaces all of that work with the second student and so on. When you finally exit the loop, message only remembers the last student it processed.

By declaring the string outside of the loop and assigning it an empty string:

var message = '';

and only using += inside of the loop, it will build up a string which contains the information for all of the students.

Whenever you use =, it will erase anything stored in the variable and replace it with whatever you just assigned.

By the way, you can make your own code blocks. You do it like this:

```JavaScript

// paste your JavaScript code here

```