Javascript - Qual é a diferença entre var e let?

É uma questão de escopo.

Mas o que é escopo?

Escopo diz respeito à disponibilidade de uma variável. No javascript existem três tipos de escopos, o global, local e o de bloco. Este último foi adicionado no ES6.

Escopo global

Quando você declara uma variável fora de uma função, ela terá o escopo global, independente dela ter sido declarada com var ou let.

var teste1 = 5;

let teste2 = 10

function func() {
  console.log(teste1); // 5
  console.log(teste2); // 10
}

Neste caso ser declarada com var ou let não influencia o escopo. Será global para ambas variáveis.

Escopo local

Quando uma variável é declarada dentro de uma função ela irá possuir o escopo global. Podendo ser utilizada apenas dentro da função.

function teste1(){
    var nome = “Bruno”;
    let sobrenome = “Passos”;
    console.log(nome); // Bruno
    console.log(sobrenome); // Passos
}

function teste2(){
    console.log(nome); // erro
    console.log(sobrenome); // erro
}

console.log(nome) // erro
console.log(sobrenome); // erro

Desta forma podemos ver que a variável declarada dentro da função com var ou let estará disponível apenas dentro da função.

Escopo de bloco

Aqui veremos a grande diferença entre var e let. Para entendermos como funciona os escopo de bloco precisamos saber primeiro o que é um bloco. De forma simples podemos dizer que um bloco é tudo que estiver entre chaves ({}). Vemos em estruturas de condição, de repetição e outras entidades que trabalham com blocos. Desta forma podemos concluir que uma variável com escopo de bloco, é uma variável que foi declarada dentro de um determinado bloco. Ou seja, dentro de if, for, while, etc…

A única forma declarar uma variável dentro do escopo de bloco é utilizando a variável let.

var nota1 = 8;
var nota2 = 5;

if (nota1 >= 7) {
  let resultado1 = "Aprovado";
  console.log(resultado1); // Aprovado
}

console.log(resultado1); // erro

if (nota2 < 7) {
  var resultado2 = "Reprovado";
  console.log(resultado2); // Reprovado
}

console.log(resultado2); // Reprovado

function func() {
  console.log(resultado1); // erro
  console.log(resultado2); // Reprovado
}

Agora vemos que a variável que foi declarada com let dentro do if só pode ser acessada dentro dele, enquanto que a que foi declarada com var dentro de outro if também pode ser acessada de outros lugares.