Qual a diferença de let e var | Lógica de programação: comece em lógica com o jogo Pong e JavaScript

Fala, Valdney! Tudo bem? Espero que sim!!!

Meu amigo, existe uma pequena diferença (pequena mesmo).

A diferença está no ESCOPO. Daí você me pergunta o que é isso? Escopo, na mais é, onde a variável será utilizada dentro do código, por exemplo: dentro de uma função, laços de repetição ou mesmo fora.

O "var" possui o escopo GLOBAL e LOCAL. Já o "let" possui o escopo GLOBAL, LOCAL e de BLOCO.

Você vai ver que, tirando o de BLOCO, eles serão iguais.

Vamos a eles:

ESCOPO GLOBAL (quando declaramos fora da função)

<script>

  var numero = 1;            //Variável fora da função

  function exemplo1() {    //Exemplo1 consegue utilizar a variável

    console.log(numero);

  }


  function exemplo2() {     //Exemplo2 consegue utilizar a variável

    console.log(numero);

  } 

  console.log(numero);    //Aqui também consegue utilizar a variável


</script>

Se eu alterasse o "var" pelo "let" também rodaria tranquilamente na GLOBAL.

ESCOPO LOCAL ( Quando declaramos a variável dentro da função)

<script>

  function exemplo1() {        //Exemplo1 consegue utilizar a variável

    var numero = 1;                 //Variável dentro da função
    console.log(numero);

  }  

  function exemplo2() {        //Exemplo2 não consegue utilizar a variável

    console.log(numero);

  }  

  console.log(numero);         //Aqui também não consegue utilizar a variável


</script>

Se eu alterasse para "let", como no primeiro exemplo, também teríamos o mesmo resultado.

Até aqui, nenhuma diferença entre "var" e "let".

Vamos ao último:

ESCOPO DE BLOCO ( quando eu declaro a variável dentro de uma estrutura de blocos como, por exemplo, uma estrutura de repetição, uma estrutura condicional ou tudo que trabalhe dentro de blocos ({}).

Vamos aos exemplos:

<script>

  var verifica = true;

  if(verifica) {          // Olha meu bloco condicional aqui
    let numero = 1;       // Agora o "let" restringiu minha variável ao bloco "if" 
    console.log(numero);  
  }

  function exemplo1() {   // Exemplo1 não consegue utilizar a variável

    console.log(numero);

  }

  function exemplo2() {   //Exemplo2 não consegue utilizar a variável

    console.log(numero);

  }  

  console.log(numero);    //Aqui também não consegue utilizar a variável


</script>

Perceba que somente o "if" pode utilizar a variável. Os demais não!!!

Vamos ao "var":

<script>

  var verifica = true;

  if(verifica) {          // Olha meu bloco aqui
    var numero = 1;       // Agora o var não restringe ao bloco 
    console.log(numero);  
  }

  function exemplo1() {   // Exemplo1 consegue utilizar a variável

    console.log(numero);

  }

  function exemplo2() {   //Exemplo2 consegue utilizar a variável

    console.log(numero);

  }  

  console.log(numero);    //Aqui também consegue utilizar a variável


</script>

Percebe que o ESCOPO de bloco não pertence ao "var"?

Em resumo, o dois são muito parecidos, agora cabe a quem está programando querer restringir ao bloco ou não!!!

Segue um artigo nosso muito mais detalhado para você dar uma lida, meu amigo.

Espero ter ajudado, Valdney!!!

Bons estudos e vamos em frente!!!