Este artigo descreve em detalhes vários métodos de definição de função comum em JavaScript e é compartilhado com você para sua referência. A análise específica é a seguinte:
Primeiro, vamos dar uma olhada nas quatro definições de função mais comuns em JavaScript:
A função definida com o construtor da função, o código é o seguinte:
var multiply = nova função ('x', 'y', 'return x * y;');Declaração da função, esse método também é o mais comum:
função multiply (x, y) {return x * y;}Expressões de função, declaradas como função anônima e depois atribuídas a uma variável, são maneiras muito comuns:
var multiply = function (x, y) {return x * y;}Expressão da função, mas a declaração de função é uma função nomeada e, em seguida, atribuiu um valor a uma variável, que se parece exatamente da mesma maneira:
var multiply = function multi (x, y) {return x * y;}Primeiro, vamos comparar o nome da função e o relacionamento direto entre a variável de função atribuída à função. É realmente um pouco ... para ser mais intuitivo, do Exemplo 4 agora, é a relação entre a variável de função multiplique e o nome da função Multi:
Os nomes de funções não podem ser modificados, pelo contrário, as variáveis de função podem ser transferidas. Deve ser fácil entender que as variáveis de função podem ser transferidas. Em nosso quarto exemplo, a variável multiplique definida, não é agradável de ver e reatribuir para:
multiply = function (x, y) {return x + y;}Eu imediatamente me transformei da multiplicação em adição. No entanto, é impossível alterar a variável multi -função. A definição de função já está lá. Contanto que ainda mantenha sua referência, não mudará. Pode não ser fácil de entender aqui. Pense assim como este primeiro, e então você poderá entendê -lo lentamente.
O nome da função não pode ser usado fora da função ao mesmo tempo, é visível apenas dentro do corpo da função. Um exemplo muito simples:
var foo = barra de função () {alert ('hello');} foo (); // Prompt "Hello String Bar (); // executa um erro, a barra não é definidaE, obviamente, o bar aqui é realmente um nome de função, mas realmente não pode ser chamado externamente. Neste momento, definitivamente haverá sapatos infantis perguntando por que esse exemplo ainda parece tão bem-comportado, assim como o Exemplo 4, por que não usar o método do Exemplo 2? Boa pergunta, deixe -me quebrá -lo lentamente.
Continuando com o Exemplo 4, podemos ver que o nome da função (multi) e a variável de função (multiplicar) não são os mesmos, mas, na verdade, os dois não têm nenhum relacionamento, portanto, não há necessidade de manter a consistência. Falando nisso, acho que os quatro exemplos acima devem ser reduzidos para 3, e o Exemplo 2 e o Exemplo 4 devem ser essencialmente consistentes. O que, não acredita? Hehe, eu tenho que continuar continuando em um silêncio ~ continue lendo ~~
Descobrimos que, em comparação com o Exemplo 2 e o Exemplo 4, há apenas menos variáveis de função VAR, enquanto comparado com o Exemplo 3, há apenas menos esse nome de função. Da perspectiva do fenômeno, a essência do Exemplo 2 e do Exemplo 4 são iguais, e a evidência é a seguinte:
function foo () {} alert (foo); // solicita o nome da função que contém "foo" var bar = foo; alert (bar); // solicita o nome da função ainda contém apenas "foo" e não tem relacionamento com a barraÉ realmente o IronClad? É a maneira de escrever o código acima semelhante ao Exemplo 2 em combinação com os códigos no Exemplo 4? Correto, foi isso que eu acabei de dizer que os dois deveriam ser essencialmente os mesmos. No entanto, ao definir a função no Caso 2, o mecanismo JS nos ajudou a fazer algo, como declarar uma função com o nome da função, multiplicar e definir silenciosamente uma variável também chamada multiplicar e, em seguida, atribuí -la a essa variável, dois exatamente os mesmos nomes. Pensamos que, ao usar o nome da função, estávamos realmente usando a variável de função multiplicar, por isso estávamos tontos ~ para ser sincero, eu também estava tonta ~ em resumo, quando chamamos, na verdade chamamos de variável de função e o nome da função não poderia chamar a função de externamente, por isso tínhamos a inferência acima.
No entanto, uma pequena diferença a ser mencionada aqui é que a função definida pelo método da declaração de função é diferente da declaração do construtor ou da declaração de expressão da função, o método da declaração de função pode ser chamado antes da definição da função ... para não mencioná -lo, basta procurar o código:
foo (); // tip fooofunction foo () {alert ('foo');} bar (); // amigo, é realmente diferente do exposto, então não se mostre. Isso não é um erro? A barra de prompt não é definida var bar = function () {alert ('bar');}Vamos falar sobre as funções declaradas pelo construtor. As funções declaradas não herdarão o escopo do local declarado atual. Eles só terão um escopo global por padrão. No entanto, isso é o mesmo em outras funções, métodos de declaração, como segue:
function foo () {var hi = 'hello'; // Return function () {// alert (hi); //}; Função de retorno ('return hi;');} foo () (); // Para o efeito de execução, corra e veja sozinhoPode -se imaginar que a execução da função retornada usando o construtor declarada inevitavelmente relatará um erro porque a variável HI não está em seu escopo (ou seja, escopo global).
Outro ponto é que as pessoas costumam dizer que as funções declaradas no modo construtor são ineficientes. Por que isso? Hoje, aprendi com o documento que as funções declaradas nas outras três maneiras serão analisadas apenas uma vez. De fato, eles existem no fechamento, mas isso está relacionado apenas à corrente do escopo, e o corpo da função será analisado apenas uma vez. Mas o método construtor é que toda vez que uma função é executada, seu corpo de função será analisado uma vez. Podemos pensar que a função declarada dessa maneira é um objeto, que armazena parâmetros e corpo de função. Cada vez que é executado, deve ser analisado uma vez e os parâmetros e o corpo da função serão executados, o que inevitavelmente será ineficiente. Não sabe como fazer o experimento específico?
Finalmente, vamos falar sobre algo que ninguém presta atenção. Quando parece que a maneira de função declarações não é o modo de função a vida (ainda está tão inclinado a simplificar, quando o caminho do Exemplo 2 se torna outra maneira inadvertidamente):
Quando se torna parte da expressão, é como o Exemplo 3 e o Exemplo 4.
Não é mais o "elemento de origem" do próprio script ou função. Qual é o elemento de origem? Isto é, uma declaração não aninhada no script ou um corpo de função, como:
var x = 0; // elemento de origem se (x == 0) {// elemento de origem x = 10; // não é um elemento de origem, porque está aninhado na declaração if função boo () {} // não é um elemento de origem, porque está aninhado na instrução if declaração} function foo () {// elemento de origem var y = 20; // Barra de função do elemento de origem () {} // elemento de origem while (y == 10) {// Função do elemento de origem blah () {} // não é um elemento de origem, porque é aninhado na instrução y ++; // não é um elemento de origem, porque está aninhado em um tempo declaração}}Eu entendi aproximadamente o conceito de elementos de origem. Continuarei com a declaração de função que acabei de mencionar. Por favor, veja:
// função declaração função foo () {} // função expressão (função bar () {}) // Expressão da função x = função hello () {} if (x) {// função função função world () {}}} // função função função a () {// função função b () {}}}} {/)Finalmente, deixe -me falar sobre meu próprio entendimento. A razão para distinguir entre a declaração da função e a declaração de não função é que, na minha opinião, a definição de função de declaração do função Método será declarada antecipadamente quando o mecanismo de análise JS a executar. Ou seja, como acabamos de dizer acima, pode ser usado antes da definição da função. De fato, o mecanismo de análise o analisou antes de usá -lo. No entanto, declaração não função, como a declaração da função de expressão, o mecanismo de análise JS definirá apenas a variável declarada pelo VAR antecipadamente. No momento, o valor variável é indefinido e a atribuição real a essa variável está no local real do código. Portanto, os erros acima mencionados são todos indefinidos. A variável real foi definida, mas ainda não foi atribuída. O mecanismo de análise JS não sabe que é uma função.
Acredito que a descrição deste artigo tenha um certo valor de referência para o design de programação da Web JavaScript de todos.