JavaScript JavaScript Loops, Arrays and Objects Simplify Repetitive Tasks with Loops For Loops

Nicholas Wallen
Nicholas Wallen
12,278 Points

Honestly, this video doesn't explain very much.

He doesn't bother to explain why we are using an HTML variable in the beginning, which is why the questions section is full of confused people. And it doesn't make sense for him to add the document.write command after the closing parenthesis, only for the following Quiz to have it included within. There is no statement where it shows it can be included within the brackets or outside of them, and still work the same.

Tobias Trinkler
Tobias Trinkler
Full Stack JavaScript Techdegree Student 16,534 Points

Hei Nicholas, he creates the html var in order to use it in the loop. While in the loops he adds html div tags to the variable and at the end he prints it out to the webpage using document.write().

Let me know, what exactly you are having trouble with:).

1 Answer

Marcus Mayorga
Marcus Mayorga
5,863 Points

He doesn't bother to explain why we are using an HTML variable in the beginning

He does mention it quickly at 4:28: “Let's start by creating a variable that will hold the HTML that will print to the page.”

The html variable is created like that to initialize it as empty. It has to be initialized to 0(zero) by using an empty set of quotes because without it the document.write will display it as undefined at first.

Like Tobias said, it’s created to store the completed concatenated i count and the html <div> tags into one variable to be used in the document.write

The document.write needs to be outside the for loop so it is not included in the loop cycle.

That way, the for loop only writes one competed set of 10 <div>’s. If it was included inside the for loop it would complete 10 cycles of incrementing the number and adding a <div> to the page each time. That would produce 10 sets of incrementing <div>’s until there was a set of <div>’s with all 10 in it.

If you’re curious as to how that would look, go back to the workspace and enter this:

var html = '';

for (var i = 1; i <= 10; i += 1) {
  html += '<div>' + i + '</div>';
    document.write(html + '<br />');
}

I included the <br /> tag in the document.write just to show what is happening a little more clearly, giving each set of <div>’s their own line. Otherwise the <div>’s would appear to be all on one line.

Hope that helps.

Immanuel Jaeggi
Immanuel Jaeggi
5,164 Points

This is weird since I just read other comments that say it doesn't matter whether the document.write is inside or outside the loop. The above code shows what does happen when the document.write is inside the loop.

Guess you have to learn by trial and error.