[Dúvida] Linhas e colunas

Oi, Ross

O "for" é um loop, um laço de repetição

Sintaxe:

for ([inicialização]; [condição]; [expressão final]) {
    [bloco de código]
}
   

• inicialização - é executada (uma vez) antes da execução do bloco de código

• condição - define a condição para executar o bloco de código

• expressão final - é executada (todas as vezes) após a execução do bloco de código

• bloco de código - é executado enquanto a condição for verdadeira

Vamos ao código

// O nome da variável não importa

function pulaLinha() {
  document.write("<br>");
}

function mostra(frase) {
  document.write(frase);
  pulaLinha();
}


for (let i = 1; i <= 3; i++)
    /* 
        Bloco Linha (nome fictício)
        Este bloco de código inicia com i = 1
        Será executado enquanto i <= 3
        Ao final do bloco o i++
        Então este bloco será executado 3 vezes
    */ 
{
  for (var j = 1; j <= 10; j++)
        /*
            Bloco Coluna (nome fictício)
            Este bloco de código inicia com j = 1
            Será executado enquanto j <= 10
            Ao final do bloco o j++
            Então este bloco será executado 10 vezes
        */ 
  {
    document.write("*");
  } // final do bloco Coluna
  
  pulaLinha();

} // final do bloco Linha


/*

O bloco Linha será executado 3x

1ª execução:
  O bloco Coluna será executado 10x
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
  pulalinha();

2ª execução:
  O bloco Coluna será executado 10x
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
  pulalinha();

3ª execução:
  O bloco Coluna será executado 10x
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
    document.write("*");
  pulalinha();


*/

Usamos o "for" para evitar repetição de código

Como seria sem o "for"

function pulaLinha() {
  document.write("<br>");
}

function mostra(frase) {
  document.write(frase);
  pulaLinha();
}

document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
pulaLinha();
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
pulaLinha();
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
document.write("*");
pulaLinha();

Imagina se fossem 30 linha e 100 colunas

Luis, muito obrigado pela explicação!

Sei que o "for" é para evitar repetição de código, acredito que a minha confusão foi pq acabei me prendendo nos nomes das variaveis, pois não havia ficado claro como que o computador entenderia o que é "vertical" e "horizontal", mas agora ficou mais claro.

Muito obrigado!