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
Thanapat Sorralump
6,325 PointsConfuse about For loops
If i write like this
var html = " ";
for (i=1; i<=10; i++) {
html += "<div>" + i + "</div>";
}
document.write(html);
the result is 1 2 3 4 5 6 7 8 9 10
but if i write like this
var html = " ";
for (i=1; i<=10; i++) {
html = "<div>" + i + "</div>";
}
document.write(html);
the result is 10
i suspect the difference of
html += "<div>" + i + "</div>";
and
html = "<div>" + i + "</div>";
when is the html += "<div>" + i + "</div>" go out of the loop?
PS. sorry if my english skill make you confuse with my question.
2 Answers
Rich Knoll
50 PointsHi Thanapat.
You are correct. The difference are the = and += operators. In the first example, the for loop starts at i=1 and iterates until i=11, at which point it exits the loop. At the point the loop is exited, the value of i is still 10. This is what is executed by your document.write function.
In your second example, the same thing happens with one exception. Instead of replacing the value of i for each iteration of the loop, you simply add to it by the use of the += operator. When the loop is exited, the value of i is what you see printed out by your call to document.write.
If you put the document.write inside the for loop of your examples you may better understand what is going on with the loops as document.write will be called once for every iteration of the loop.
I hope this helps!
Thanapat Sorralump
6,325 PointsThank you so much Rich Knoll When i put the document.write inside the for loop it make me know how code work and now i understand what i confuse.
Thank you 1000 times. Haha
Chris Shaw
26,676 PointsThe main difference between the two is the += operator which is the shorthand way for concatenating two strings together, the long way which is equivalent is the following.
html = html + "<div>" + i + "</div>";
This is very cumbersome so it's best practice to use the shorthand operator instead, as for the original question the second example you have isn't working because the equals = operator simply assigns the string as the value which in the loop just overwrites html 10 times resulting in just one DIV being output in the HTML.
Hope that helps.
Thanapat Sorralump
6,325 PointsThank you so much Chris Upjohn
Rich Knoll
50 PointsRich Knoll
50 PointsHi Thanapat.
You are correct. The difference are the = and += operators. In the first example, the for loop starts at i=1 and iterates until i=11, at which point it exits the loop. At the point the loop is exited, the value of i is still 10. This is what is executed by your document.write function.
In your second example, the same thing happens with one exception. Instead of replacing the value of i for each iteration of the loop, you simply add to it by the use of the += operator. When the loop is exited, the value of i is what you see printed out by your call to document.write.
If you put the document.write inside the for loop of your examples you may better understand what is going on with the loops as document.write will be called once for every iteration of the loop.
I hope this helps!