Discussion on: Cycles while and for in JS, help me!

Loops are always a bit tricky so I like to show my students three basic rules for loops.

1. Initialize a loop control variable (Used to start and stop the loop)

2. Write a test condition (Otherwise how will the loop know when to exit)

3. Update the loop control variable (Without this we'll have an infinite loop)

I've copied the relevant section of your code below and added comments:

var l = 0;               // 1. Setup the loop control variable

while (l < lineas) {     // 2. The test condition that will start/stop the loop
    yi = 10 * l;
    xf = 10 * (l + 1);
    dibujarLinea(colorcito, 0, yi, xf, 300);
    console.log("Linea " + l)
    l = l + 1;           // 3. Update the loop control variable
} 

A for loop is a control structure that allows us to perform all three steps on a single line. It really doesn't add much more functionality than a while loop does since you can simulate a for loop by writing code that way you did for the first drawing. You can achieve the same results as the code above with the following for loop:

//   1. init      2. test   3. update
for (let l = 0; l < lineas; l++){
    yi = 10 * l;
    xf = 10 * (l + 1);
    dibujarLinea(colorcito, 0, yi, xf, 300);
    console.log("Linea " + l)
} 

I hope this clears things up! Also can I ask where that tutorial is from?