1. O que é um fechamento
Um fechamento é uma função que tem permissão para acessar variáveis em outro escopo de função.
Simplificando, o JavaScript permite o uso de funções internas - ou seja, as definições de função e as expressões de função estão localizadas no corpo de função de outra função. Além disso, essas funções internas podem acessar todas as variáveis locais, parâmetros e outras funções internas declaradas na função externa onde residem. Quando uma dessas funções internas é chamada fora da função externa que as contém, um fechamento é formado.
2. O escopo das variáveis
Para entender o fechamento, você deve primeiro entender o escopo das variáveis.
Existem apenas dois tipos de escopos de variáveis: variáveis globais e variáveis locais.
O recurso especial da linguagem JavaScript é que as variáveis globais podem ser lidas diretamente nas funções.
As variáveis das funções externas podem ser acessadas na função interna porque a cadeia de escopo da função interna contém o escopo da função externa;
Também pode ser entendido como: a faixa de ação da função interna irradia para a faixa de ação da função externa;
var n = 999; função f1 () {alert (n);} f1 (); // 999Por outro lado, as variáveis locais dentro da função naturalmente não são lidas fora da função.
função f1 () {var n = 999;} alerta (n); // erroHá um lugar para se notar aqui. Ao declarar variáveis internamente, você deve usar o comando var. Caso contrário, você realmente declara uma variável global!
função f1 () {n = 999;} f1 (); alert (n); // 9993. Várias maneiras de escrever e usar fechamentos
3.1. Adicione algumas propriedades à função
Círculo de função (r) {this.r = r; } Circ.pi = 3.14159; Circ.prototype.area = function () {return circ.pi * this.r * this.r; } var c = novo círculo (1.0); alerta (c.area ()); //3.141593.2. Declare uma variável e atribua uma função à variável como um valor.
var círculo = function () {var obj = new Object (); obj.pi = 3.14159; obj.area = function (r) {return this.pi * r * r; } retornar obj; } var c = new Circle (); alerta (c.aréia (1.0)); //3.141593.3. Este método é usado com mais frequência e é o mais conveniente. var obj = {} é declarar um objeto vazio
var círculo = {"pi": 3.14159, "área": function (r) {return this.pi * r * r; }}; alerta (círculo.area (1.0)); // 3.141594. A principal função do fechamento
Os fechamentos podem ser usados em muitos lugares. Ele tem dois maiores usos: um é que as variáveis dentro da função podem ser lidas como mencionadas acima, e a outra é que os valores dessas variáveis são sempre mantidos na memória.
4.1. Como ler variáveis locais de fora?
Por vários motivos, às vezes precisamos obter variáveis locais dentro da função. No entanto, como mencionado anteriormente, em circunstâncias normais, isso não pode ser feito e só pode ser alcançado por meio de soluções alternativas.
Isso é para definir outra função dentro da função.
função f1 () {var n = 999; função f2 () {alert (n); // 999}}No código acima, a função F2 está incluída na função interna F1 e todas as variáveis locais dentro de F1 são visíveis para F2. Mas o contrário não é possível. As variáveis locais dentro de F2 são invisíveis para F1. Esta é a estrutura do "escopo da cadeia" exclusivo da linguagem JavaScript. Os objetos infantis procurarão o nível para cima por nível para todas as variáveis de objetos pais. Portanto, todas as variáveis do objeto pai são visíveis para o objeto filho, caso contrário, não é verdadeiro.
Como F2 pode ler variáveis locais em F1, desde que F2 seja usado como valor de retorno, não podemos ler suas variáveis internas fora da F1?
função f1 () {var n = 999; função f2 () {alert (n); } retornar f2;} var resultado = f1 (); resultado (); // 9994.2. Como salvar sempre o valor de uma variável na memória?
função f1 () {var n = 999; nadd = function () {n+= 1} função f2 () {alert (n); } retornar f2;} var resultado = f1 (); resultado (); // 999Nadd (); resultado (); // 1000Neste código, o resultado é na verdade a função F2 de fechamento. Ele é executado duas vezes no total, o primeiro valor é 999 e o segundo valor é 1000. Isso prova que a variável local n na função F1 foi mantida na memória e não é automaticamente limpa após a chamada F1.
Por que isso está acontecendo? O motivo é que a F1 é a função pai de F2 e F2 é atribuída a uma variável global, o que faz com que F2 esteja sempre na memória, e a existência de F2 depende de F1. Portanto, a F1 está sempre na memória e não será reciclada pelo mecanismo de coleta de lixo após o término da chamada.
Outro ponto notável neste código é que a linha "nadd = function () {n+= 1}" é usada pela primeira vez antes do NADD, então o NADD é uma variável global, não uma variável local. Em segundo lugar, o valor do NADD é uma função anônima, e essa função anônima em si também é um fechamento, portanto, o NADD é equivalente a um setter, que pode operar em variáveis locais dentro da função fora da função.
5. Fechamentos e este objeto
Usar esse objeto em fechamentos pode causar alguns problemas. Como a execução de funções anônimas é global, esse objeto geralmente aponta para a janela. O código é o seguinte:
var name = "a janela"; var object = {name: "meu objeto", getNameFun: function () {return function () {return this.name;};}}; alert (object.getNamefun () {}); // "The Window" (no modo não rito)Salve este objeto no escopo externo em uma variável que pode ser acessada por um fechamento, e o fechamento pode acessar o objeto. O código é o seguinte:
var name = "a janela"; var object = {name: "meu objeto", getNameFun: function () {var that = this; return function () {return that.name;};}}; alert (object.getNamefun () {}); // "meu objeto"6. Fechamentos e vazamentos de memória
Especificamente, se um elemento HTML for armazenado no escopo do fechamento, significa que o elemento não pode ser destruído. do seguinte modo:
função atributHandler () {var element = document.getElementById ("algum elemento"); element.OnClick = function () {alert (element.id);}}O código acima cria um fechamento como o manipulador de eventos do elemento elemento, e esse fechamento cria uma referência circular. Como as funções anônimas salvam uma referência ao objeto ativo do cenário do que atribuições (), não será possível reduzir o número de referências ao elemento. Enquanto uma função anônima existir, o número de referências ao elemento é de pelo menos 1, portanto a memória que ocupa não será reciclada.
Resolva problemas internos de reciclagem reescrevendo o código:
função atributHandler () {var element = document.getElementById ("algum elemento"); var id = element.id; element.OnClick = function () {alert (id);} elemento = null;}No código acima, o fechamento da implementação não se refere diretamente ao elemento e uma referência ainda será salva no objeto ativo que contém a função. Portanto, é necessário definir a variável do elemento para nulo, para que a memória que ocupa possa ser reciclada normalmente.
7. Notas sobre o uso de fechamentos
1) Como o fechamento fará com que todas as variáveis da função sejam armazenadas na memória e o consumo de memória é muito grande, os fechamentos não podem ser abusados, caso contrário, causará problemas de desempenho da página da Web e poderá levar ao vazamento de memória no IE. A solução é excluir todas as variáveis locais que não são usadas antes de sair da função.
2) O fechamento alterará o valor da variável dentro da função pai fora da função pai. Portanto, se você usar a função pai como objeto, use o fechamento como método público e use a variável interna como sua propriedade privada, tome cuidado para não alterar o valor da variável interna da função pai à vontade.
O exposto acima é uma explicação detalhada da escrita e função dos fechamentos no JavaScript apresentado a você pelo editor. Espero que seja útil para você. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a você a tempo. Muito obrigado pelo seu apoio ao site wulin.com!