Motivo de escrever:
Ao escrever funções no JS, geralmente declaramos uma função na forma de função da convenção fn () {}. Ao ler alguns plug-ins excelentes, não podemos deixar de ver a criação de funções como var fn = function () {}. Qual é a diferença entre eles? Hoje, falaremos sobre essa declaração de função fascinante no espírito de quebrar a caçarola até o fim.
Declaração de função
Função Declaração Código de amostra
A cópia do código é a seguinte:
função fn () {
console.log ('Execução da função fn ..');
// código ..
}
Dessa maneira, declaramos uma função chamada FN. Aqui está um pensamento. Você acha que será executado se for chamado nesta função? Ou um erro será relatado?
fn (); // Ligue para a função FN que declaramos antes
A cópia do código é a seguinte:
função fn () {
console.log ('Execução da função fn ..');
// código ..
}
Resultado da saída do console:
Sim, a função FN pode ser chamada neste momento, então vamos resumir os motivos aqui.
Resumir:
1: Neste momento, a função FN é o resultado de uma variável e é armazenada em uma variável em um contexto global por padrão (pode ser verificado pela janela. Nome da função)
2: Este método é a declaração da função e eles já estão disponíveis ao entrar no estágio de contexto global e entrar no estágio de execução do código. PS: JavaScript inicializará o ambiente de contexto cada vez que entra no método (da Global → Local)
3: Pode afetar objetos variáveis (afetam apenas as variáveis armazenadas no contexto)
Expressões de função
Função Expressão Código de amostra
A cópia do código é a seguinte:
var fn = function () {
Console.log ('Fn Função [Expressão] declara a execução ...')
// código ..
}
Então, declaramos uma função anônima e apontamos sua referência à variável FN?
Novamente, chame uma vez acima e abaixo das funções declaradas por essa expressão para ver os resultados da saída do console.
A cópia do código é a seguinte:
// Para ver claramente a saída do console, deixamos uma marca antes e depois de cada chamada para aumentar a legibilidade.
console.log ('Antes da chamada começar ...');
fn ();
console.log ('A chamada anterior termina ...');
var fn = function () {
Console.log ('Fn Função [Expressão] declara a execução ...')
// código ..
}
console.log ('A chamada começa depois disso ...');
fn ();
console.log ('A chamada começa depois disso ...');
Resultados da impressão do console:
Você pode ver que, quando o código é executado pela primeira vez em que a função fn () é chamada, o prompt é: FN não é uma função (FN não é um método) e a operação é encerrada quando encontrar um erro.
Isso mostra que, quando fn () é chamado pela primeira vez, a variável var fn não existe como uma propriedade do objeto global, e o contexto de função anônima referenciado pelo FN não é inicializado; portanto, a chamada falhou antes dela.
A cópia do código é a seguinte:
// Agora comente primeiro a lógica de chamada anterior e depois veja a saída do console
// console.log ('antes da chamada começar ...');
// fn ();
// console.log ('A chamada anterior termina ...');
var fn = function () {
Console.log ('Fn Função [Expressão] declara a execução ...')
// código ..
}
console.log ('A chamada começa depois disso ...');
fn (); // chamado após a expressão
console.log ('A chamada começa depois disso ...');
Resultados da impressão do console:
Pode -se observar que não há problema em chamar a função de expressão depois dela. Vamos resumir por quê?
Resumir:
1: Primeiro de tudo, a variável em si não existe como uma função, mas uma referência a uma função anônima (o tipo de valor não pertence a uma referência)
2: Durante o estágio de execução do código, ao inicializar o contexto global, ele não existe como um atributo global; portanto, não causará contaminação de objetos variáveis.
3: Esse tipo de declaração é geralmente comum no desenvolvimento de plug-ins e também pode ser usado como uma chamada para funções de retorno de chamada nos fechamentos.
Portanto, função fn () {} não é igual a var fn = function () {}, eles têm diferenças essenciais.