Guia para iniciantes para fechamentos de JavaScript

““Fechamentos”Estão entre os blocos de construção mais fundamentais do JavaScript. Como iniciante em JavaScript, você pode ter utilizado fechamentos consciente ou inconscientemente; No entanto, a coleta de conhecimento sobre o trabalho dos fechamentos é crucial, pois permite que você entenda a interação entre variáveis ​​e funções e o processo de execução do seu programa JavaScript.

Este artigo é um completo Guia do iniciante para Fechamentos de JavaScript em que discutiremos o acesso variável em diferentes escopos.

Antes de mergulhar no conceito de fechamento de javascript, primeiro explicaremos o que Escopo lexical é como ambos os termos estão associados um ao outro.

Escopo lexical em JavaScript

O escopo variável é determinado por sua declaração no código -fonte, conhecido como “Escopo lexical”. Por exemplo, no exemplo abaixo, o criado “nome”A variável é uma“global”Variável que significa que pode ser acessada de qualquer lugar do programa, como dentro do“displayMessage ()”Função.

No entanto, "informações" é um "local”Variável que só pode ser acessada no“displayMessage ()”Função:

deixe o nome = 'Alex';
função displayMessage ()
deixe info = 'olá! Meu nome é';
console.log (info + " + nome);

displayMessage ();

A execução do código acima do rumo mostrará a seguinte saída:

Escopo lexical aninhado em JavaScript

Os escopos das variáveis ​​podem ser aninhados usando o “Escopo lexical”De tal maneira que a função interna pode ter acesso às variáveis ​​declaradas no escopo externo.

Considere o seguinte exemplo:

função displayMessage ()
deixe info = 'olá! Meu nome é Alex.';
function show ()
console.log (info);

mostrar();

displayMessage ();

Neste exemplo, o “displayMessage ()”A função tem uma variável local chamada“informações"E um aninhado"mostrar()”Função, onde“mostrar()" é um interno função que tem a capacidade de acessar o valor do “informações”Variável do escopo externo.

Então, quando o “displayMessage ()”A função é executada, chamará o“mostrar()”Função, que então acessará o“informações”Variável e exibir seu valor no console:

Agora, vamos modificar o “displayMessage ()”Método e, em vez de invocar o interno“mostrar()”Função, adicionaremos uma declaração para retornar o“mostrar()”Objeto de função:

função displayMessage ()
deixe info = 'olá! Meu nome é Alex.';
function show ()
console.log (info);

show de retorno;

Além disso, atribuímos o valor retornado pelo “displayMessage ()”Função para“x" variável:

Seja x = displayMessage ();

Por fim, vamos invocar “x ()”Função que se refere ao“mostrar()”Função:

console.log (x ());

Você pode ver na saída fornecida, o valor da variável local “informaçõesAinda existe que geralmente permanece na memória até a execução da função onde é declarada:

Parece confuso? Esta é a magia de Fecho que você viu no último exemplo como “mostrar()”É uma função de fechamento que mantém o escopo externo em seu próprio escopo.

O que são fechamentos de JavaScript

As funções JavaScript também servem como “Fechamentos”Porque o corpo de uma função tem acesso às variáveis ​​que são definidas fora dela. Ou podemos definir “Fecho”Como uma função que é uma função infantil e pode acessar as variáveis ​​criadas no“pai”Escopo da função.

Agora, vamos conferir alguns exemplos para entender a associação entre os escopos variáveis ​​e o fechamento do JavaScript.

Exemplo 1
Este exemplo demonstra como um “local" variável "informações”Pode ser acessado dentro do“mostrar()”Função onde é criado. Lembre -se, o script restante não pode acessar isso “informações" variável:

function show ()
deixe info = 'olá! Meu nome é Alex.';
retornar informações;

mostrar();

Quando o "mostrar()”A função é executada, exibirá o valor armazenado no“informações" variável:

Exemplo 2
Agora, vamos declarar “informações" como um "global”Variável que é referida na“mostrar()”Função (com escopo diferente):

deixe info = 'olá! Meu nome é Alex.';
function show ()
retornar informações;

mostrar();

Como a função JavaScript “mostrar()”A função é uma“Fecho”, Ele manterá o escopo e o estado do“informações" variável:

Exemplo 3
Em outra situação, quando as variáveis ​​são definidas no escopo do “pai”Função, a“criança”A função ainda pode acessar seu valor:

var displayMessage = function ()
deixe info = 'olá! Meu nome é Alex.';
var show = function ()
console.log (info);

mostrar();

A saída do programa especificado significa que “mostrar()”, Que é uma função infantil, pode acessar o“informações”Variável declarada na“displayMessage ()”Função pai:

Todas foram informações essenciais relacionadas ao fechamento de JavaScript. Você pode pesquisar ainda mais de acordo com seus requisitos.

Conclusão

Funções JavaScript também serve como Fechamentos Porque o corpo de uma função tem acesso às variáveis ​​que são definidas fora dela. Podemos definir Fecho como uma função infantil que pode acessar as variáveis ​​criadas no escopo da função pai. Este artigo é um completo Guia do iniciante para Fechamentos de JavaScript em que discutimos acesso variável em diferentes escopos.