Javascript Funções aninhadas
Funções aninhadas de JavaScript são os tipos de funções definidas em outra função. Uma ou mais funções podem ser adicionadas dentro de uma função, e o escopo das funções externas inclui essas funções aninhadas ou internas. As funções externas também são chamadas de funções pais, e as funções internas podem ser nomeadas como funções infantis em funções aninhadas de JavaScript. As variáveis e os parâmetros da função pai são acessíveis à função filho, enquanto a função pai não pode acessar as variáveis declaradas dentro das funções da criança.
Este artigo discutiu funções aninhadas de JavaScript. Além disso, também explicamos o escopo variável, parâmetros e declarações de retorno das funções aninhadas com a ajuda dos exemplos.
Javascript Funções aninhadas
Em JavaScript, uma função aninhada é uma função que é definida dentro ou dentro de outra função. O procedimento para criar uma função aninhada é a mesma que seguimos para a função normal, mas para criar uma função aninhada, precisamos definir a função nova ou infantil dentro da função pai.
Aqui está o Sintaxe de funções aninhadas de JavaScript:
Função ParentFunction () // Definição da funçãoFunção infunção de crianças () // definição de função
// corpo da função infantil
ChildFunção (); // Chamada de função infantil
ParentFunction (); // Chamada de função pai
Como você pode ver na sintaxe, precisamos definir a infunção da criança () dentro da função parental (). Além disso, quando queremos invocar a função infantil (), precisamos chamá -lo dentro do corpo da função parental ().
Exemplo: Usando funções aninhadas de JavaScript
Este exemplo mostrará como criar funções aninhadas de JavaScript. Para esse fim, definiremos uma função pai chamada “addNum ()”, Que tem dois parâmetros,“x" e "y”. Depois de fazer isso, criaremos uma função filho “Mostrar mensagem()”Que imprime uma mensagem de texto para a janela do console:
função addnum (x, y)// Função aninhada
Função ShowMessage (texto)
console.log (texto);
Deixe sum = x+y;
// invocando a função aninhada
showMessage ("Sum é"+ soma)
Observe que chamamos de “Mostrar mensagem()”Função dentro da definição de função do“addNum ()”Função. Na próxima etapa, chamaremos a função pai addNum () ao passar “5" e "6”Como argumentos:
addnum (5,6)Como você pode ver na saída, executamos com sucesso as funções aninhadas do nosso exemplo:
Escopo variável de funções aninhadas de JavaScript
Agora, vamos falar sobre o escopo das funções aninhadas em JavaScript. As funções aninhadas têm seu próprio escopo; No entanto, eles também podem acessar o escopo da função pai ou externa. Você deve ter em mente dois pontos sobre o escopo variável das funções aninhadas de JavaScript: uma função aninhada é privada para sua função pai e uma função aninhada tem acesso ao escopo da função pai.
Explicaremos cada uma das declarações dadas com a ajuda de exemplos.
Como afirmamos, a função aninhada é considerada “privado”Para a função que contém sua definição. Isso significa que apenas o pai ou a função contendo pode acessar a função aninhada, e você não poderá acessá -la fora da função especificada. Isso acontece porque definimos a função interna dentro do escopo da função externa.
Por exemplo, definimos uma função externa “Adicionar número()”No código abaixo e depois adicionou a função interna“Mostrar mensagem()”Na definição da função externa:
função addNumber (x, y)Função ShowMessage (texto)
console.log (texto);
Deixe sum = x+y;
showMessage ("Sum é" + soma)
Agora, quando tentamos acessar a função interna “Mostrar mensagem()"Fora de seu escopo, ele jogará o"ReferenceError não capturado”Erro:
showMessage ('20 ');Todas as funções, variáveis e argumentos definidos na função externa são acessíveis à função aninhada criada. Essa habilidade é conhecida como "escopo lexical", onde a função interna pode acessar o escopo da função pai ou externa.
Não passaremos nenhum argumento para nossa função interna do showMessage (). O que faremos é utilizar os argumentos “x" e "y" nosso "Adicionar número()”Função externa e a“soma" variável:
função addNumber (x, y)função showMessage ()
console.log ('soma de %d + %d é %d', x, y, soma);
Deixe sum = x+y;
Mostrar mensagem()
Agora, invocaremos a função externa “Adicionar número()"E passar o"4" e "6”Como argumentos:
AddNumber (4,6)Dê uma olhada na saída abaixo do ritmo, o que significa que acessamos com sucesso o “soma" variável, "x", e "y”Argumento da função externa addNumber na função showMessage ():
Retornando uma função aninhada de JavaScript
A função externa tem a capacidade de devolver a função aninhada. Por exemplo, no exemplo abaixo, a função DisplayCounter () tem um “contar”Variável e retorna a função interna increment ():
função displayCounter ()deixe count = 0;
increment = function ()
retornar ++ contagem;
;
incremento de retorno;
Guaremos a função DisplayCounter () na “contador”Na próxima etapa. Agora, o conceito que precisamos discutir aqui é que o “incremento()”A função ainda terá acesso ao“contar"Propriedade do"DisplayCounter ()”Função quando o displayCounter () terminou a execução. ““Fecho”, Um recurso JavaScript, torna isso possível.
Aqui o "contar”A propriedade é local para o“DisplayCounter ()”Função, no entanto, o definido“incremento”A função também pode acessá -la porque está aninhada dentro do“DisplayCounter ()”Função:
contador = displayCounter ()O código acima foi chamado de “DisplayCounter ()”Função. Em seguida, a função DisplayCounter () inicializará primeiro o “contar”Variável para a“0”Valor e depois retorna o“incremento()”Função. Porque o "contar”A propriedade não é destruída, quando chamaremos a função de incremento através do“contador()", Cada vez que"contar”A propriedade será incrementada de acordo com o código adicionado:
console.log (contador ());console.log (contador ());
console.log (contador ());
Confira a saída abaixo do exemplo do exemplo fornecido:
Parâmetros de funções aninhadas de JavaScript
A função interna também pode assumir argumentos. Por exemplo, no exemplo seguinte, o “Innerfunction ()"É devolvido pelo"ExterterFunction ()”E cada um deles aceita um conjunto de argumentos:
Função externa (x)Innerfunction = function (y)
console.log ("x %d y %d", x, y)
;
retornar a função interna;
Para obter o Innerfunction (), Adicionaremos o seguinte código em nosso programa JavaScript ao passar “3”Como argumento para o ExterterFunction ():
INNERFUNCTION = EXTERFUNCTION (3);Em seguida, invocaremos a função innerFunction () com valor “7”Como argumento:
INNERFUNCIONAL (7);Você também pode passar os argumentos para as funções externas e internas de uma só vez:
Função externa (2) (3);Ambas as linhas especificadas do código invocaram o InnerFunction () e a saída dos argumentos aprovados:
Conclusão
O JavaScript permite que você use funções aninhadas no programa sem encontrar erros. Uma função criança ou interna pode ser adicionada dentro de uma função externa em JavaScript. Todas as variáveis locais e globais da função externa são acessíveis à função interna. No caso da função externa, apenas os valores das propriedades globais e os métodos e variáveis definidos nas funções dos pais são acessíveis. Este artigo discutiu funções aninhadas de JavaScript. Além disso, também explicamos o escopo variável, a propriedade de fechamento, o escopo lexical, os parâmetros e as declarações de retorno das funções aninhadas de JavaScript, com a ajuda dos exemplos.