quarta-feira, 1 de abril de 2015

Javascript Fundamentos: Parte 2 - Escopo Léxico e Escopo de Função

No post anterior, nós vimos a definição de escopo e como funciona o escopo global do Javascript. Neste artigo irei mostrar o Escopo Léxico, que também é conhecido como escopo estático. Entendê-lo é fundamental para você compreender um outro assunto bacana de Javascript: Closures! Mas não se apresse! Primeiro vamos entender o que é esse tal de escopo léxico.

O escopo léxico tem a ver com o lugar onde suas variáveis e blocos foram escritos no código. Um nome (de uma variável ou bloco) sempre irá se referir ao seu escopo léxico local mais próximo, e essa propriedade não muda, independentemente da pilha da execução da linguagem. Como é que é?? Calma jovem, logo tudo isso fará mais sentido. 

O escopo léxico define como as variáveis são resolvidas em funções aninhadas, de forma que uma função aninhada terá acesso às variáveis declaradas nas funções mais externas. É como se a função interna contivesse todo o escopo das funções externas. Veja o exemplo abaixo:

Para resolver uma variável, a engine do Javascript faz uma busca em todos os escopos visíveis, do mais interno ao mais externo (global). Outra ponto importante de se destacar, é que a busca para ao encontrar a primeira declaração correspondente. Vejamos:

A operação mais interna a ser executada é a função bar, e nela, a chamada console.log(a, b, c). A engine tentará resolver 'a' no escopo de bar, ao não encontrar, ela sobe para o escopo foo, onde estará 'a', que será usado e a busca terminada. O mesmo ocorrerá com 'b', já no caso de 'c', o valor estará dentro do escopo de bar e será usado.

O escopo léxico é definido pelo programador ao escrever uma variável em determinado lugar do código. O mecanismo de interpretação do Javascript saberá então onde localizar o valor a ser atribuído durante a execução do código. Isso seria uma tarefa de compilação, porém como Javascript não é uma linguagem compilada, essa tarefa é chamada de Lexing Time.

Function Scope

Javascript não possui escopo de bloco! Isso confunde a cabeça de quem vem de linguagens como Java, C, C#, por exemplo. Toda função em Javascript cria um novo escopo. Vejamos um exemplo bem simples abaixo:

Como era esperado, a variável 'a' é criada em cada função e não é afetada por outros escopos. Nesse caso ocorre o fenômeno que é conhecido como Shadowing, se uma variável com o mesmo nome é criado em um escopo aninhado esta acaba 'sombreando' o valor declarado no escopo superior.

Já que não existe escopo de bloco em Javascript, estruturas como for ou while não criam um novo escopo. Vejamos qual implicação disso no trecho de código abaixo:

A variável 'i', embora criada dentro do laço for, é visível mesmo fora dele, ou seja, ela na verdade pertence ao escopo da função loop. Em um outro artigo veremos que isso ocorre devido a um comportamento da linguagem Javascript chamado de Hoisting.

No próximo artigo fecharemos o assunto de escopo falando sobre IIFE e Hoisting. Até o próximo post!

Nenhum comentário:

Postar um comentário