Interactive online courses HTML Academy
2026-03-09 12:25 Diff
https://htmlacademy.org/courses/javascript-browser/browser-intro/add-cycle

While we were writing the code, data was completely loaded from 1-Muffin. Data is stored in the cardsData object array.

Now there are a lot of products and we need to call createCard for each of them. It seems that it’s time to use the for loop.

Let’s write a loop that will go through the array of data. Within the loop, we will transfer the current element array[i] into the createCard function and insert the obtained result at the end of the product list. That way we will make the program universal for any number of cards.

The loop can look like this:

var item; for (var i = 0; i < array.length; i++) { item = createCard(array[i]); list.appendChild(item); }

In this code, we first declare a variable, and then inside the loop, we override its value at each iteration. We use the variable only inside the loop. We don’t need it before and after the loop, and therefore it’s pointless to declare it outside the loop. Let’s take this into account and create a variable inside the loop at each iteration. Inside of it, we will record the result of calling createCard(array[i]), and then add the contents of this variable to the end of the product catalog. The loop will look like this:

for (var i = 0; i < array.length; i++) { var item = createCard(array[i]); list.appendChild(item); }