JS - Hoisting

Comportamento do Javascript que eleva ao topo do escopo variáveis e funções literais, ou seja, mesmo que uma variável seja declarada no meio do programa a mesma será colocada no inicio, o ponto de atenção aqui é quanto a atribuição de valores, pois essa permanece no local original. 

Esse comportamento pode gerar problemas pois podemos ser levados a acreditar que as coisas deveriam estar corretas quando na verdade não, uma dica é manter as variáveis no topo dos escopos juntamente com suas atribuições. Agora alguns exemplos usando o escopo de uma função para exemplificar:

Variáveis

Já sabemos que as variáveis "a" e "b" só podem ser acessadas dentro do escopo da função "TesteHoisting", mas o que deve ocorrer com a implementação abaixo? Bom de acordo com o que vimos, o "hoisting" irá elevar as variáveis "a" e "b" ao topo do escopo, e, apesar das variáveis existirem ambas estarão com o valor "undefined", quando o "console.log" for executado as variáveis existirão, porém sem o valor esperado:

function TesteHoisting(){

  console.log('variavel a: ', a);

  console.log('variavel b: ', b);

  

  var a = 3;

  var b = 3; 

}

Funções

Já sabemos que a função "soma" (e as variáveis) só podem ser acessadas dentro do escopo da função "TesteHoisting", mas o que deve ocorrer com a implementação abaixo? Conforme vimos as funções literais também são elevadas, logo, mesmo que ela esteja declarada após o retorno da função o código abaixo funcionará:

function TesteHoisting(){
 
  var a = 3;
  var b = 3;

  return soma();

  function soma() {
    return a + b;
  }
}