JavaScript: Fuja do escopo global.
Published: 2022-02-09 15:28:13



> **Para começarmos, o que e escopo?**

Bom, escopo designa um limite dentro quais recursos podem ser utilizados, está e a definição de escopo. Agora em JavaScript, quando falamos de escopo, temos dois tipos de escopo que trabalham de diferente formas, eles são os escopos globais (devemos evitá-lo) e escopo locais, se utilizarmos da forma certa, podemos criar um código muito mais eficiente. 


> **Escopo Global**

O escopo global e quando declaramos uma variável no contexto global do código, sem estar no contexto de uma função, ex:

`var nome = "Cleitinho Rasta"`
`console.log(nome) // Cleitinho Rasta`


A variável "nome" está sendo contextualizada globalmente, assim ela pode ser modificada/lida de qualquer lugar do código.

> **Escopo local**

Quando declaramos uma variável dentro de um bloco de uma função, chamamos ela de variável local por que ela esta disponível apenas dentro da função, ex:

``
function digaNome() {
    var nome = 'Fabinho do Pneu'
}
console.log(nome) // Lançará um erro
``


O código acima não será executado, pois a variável "nome" esta disponível apenas dentro da função "digaNome". Quando a função "digaNome" acabar de ser executada a variável diga nome não estará mais disponível.

Exemplo de um codigo real:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9k8du44tibupj0u09590.png)
Dito isso, sabemos o contexto na qual será executado as variáveis, deixando claro que devemos evitar a declaração de variáveis global, pois declarando desta forma a variável sempre esta disponível/alocada na memoria e então estaremos tendo uma perda de desempenho, isto em um sistema grande pode ser uma grande desvantagem. 

> **Conheça o IIFE e veja o funcionado**

O IIFE(Self-Executing Anonymous Function) em português significa "Função anônima auto executante", como o próprio nome já diz, ela e uma função que assim que declarada ela auto executada sem precisar ser chamada como as funções normais.


Para usarmos o IIFE devemos utilizar os parênteses "()", e dentro dela devemos colocar a sintaxe de uma função, 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k19of7pek9fn07jebzbi.png)


E para ser executada devemos novamente utilizar os parênteses "()".

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8apzcle0nnwg53e9tv1t.png)
 

Tentando acessar a variável musica fora do escopo:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uz2pwfyrvkncnzfg7q7m.png)
 
A variável "musica", não e acessada pois não esta no contexto global. Isto é ótimo para evitar que variáveis já declaradas globalmente se conflitam.

Uma boa pratica ao utilizamos IIFE e colocarmos um ponto e virgula antes dos primeiros parênteses, assim:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rl8ubfnuysavobtn33si.png)

E uma boa pratica. Sem elas, Assim que o código for executado, poderá haver um conflito, exemplo:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ug5p6nryy5elmzjygacs.png)
 

O código lançara um erro.


> **Conclusão:**

Vimos que evitar as variáveis globais e uma boa pratica para que nossa aplicação seja mais eficiente e também não haver conflitos em nosso código através dos escopos locais e também IIFE'S.