Quite often we need to perform a similar action in many places of the script.
por exemplo, precisamos mostrar uma mensagem bonita quando um visitante entra, sai e talvez em outro lugar.
funções são os principais “blocos de construção” do programa. Eles permitem que o código seja chamado muitas vezes sem repetição.
já vimos exemplos de funções internas, como alert(message)
prompt(message, default)
e confirm(question)
. Mas também podemos criar funções próprias.,
Declaração de função
para criar uma função podemos usar uma declaração de função.
Ele se parece com isso:
function showMessage() { alert( 'Hello everyone!' );}
function
palavra-chave vai em primeiro lugar, em seguida, passa o nome da função e, em seguida, uma lista de parâmetros entre parênteses (separados por vírgula, vazio, no exemplo acima) e, finalmente, o código da função, também chamado de “o corpo da função”, entre chavetas.,
function name(parameters) { ...body...}
a Nossa nova função pode ser chamada pelo seu nome: showMessage()
.
Por exemplo:
function showMessage() { alert( 'Hello everyone!' );}showMessage();showMessage();
A chamada showMessage()
executa o código da função. Aqui veremos a mensagem duas vezes.
Este exemplo demonstra claramente um dos principais objectivos das funções: evitar a duplicação de código.,
Se alguma vez precisarmos de mudar a mensagem ou a forma como ela é mostrada, é suficiente modificar o código em um só lugar: a função que a emite.
variáveis locais
uma variável declarada dentro de uma função só é visível dentro dessa função.
Por exemplo:
> Exterior variáveis
Uma função pode acessar um exterior variável, como, por exemplo:
let userName = 'John';function showMessage() { let message = 'Hello, ' + userName; alert(message);}showMessage(); // Hello, John
A função tem acesso completo para o exterior variável. Também pode modificá-lo.,
por exemplo:
A variável exterior só é usada se não houver nenhuma local.
Se uma variável com o mesmo nome é declarada dentro da função, então ela esconde a variável externa. Por exemplo, no código abaixo a função usa o local userName
. A externa é ignorada:
variáveis declaradas fora de qualquer função, tais como a externa userName
no código acima, são chamadas globais.
variáveis globais são visíveis a partir de qualquer função (a menos que sombreado pelos locais).,é uma boa prática minimizar o uso de variáveis globais. O código moderno tem poucos ou nenhuns globais. A maioria das variáveis residem em suas funções. Às vezes, porém, eles podem ser úteis para armazenar dados de nível de projeto.
parâmetros
podemos passar dados arbitrários para funções usando parâmetros (também chamados de argumentos de função) .
No exemplo abaixo, a função tem dois parâmetros: from
e text
.,
Quando a função é chamada em linhas (*)
e (**)
, os valores indicados são copiados para variáveis locais from
e text
. Então a função usa-os.
Aqui está mais um exemplo: temos uma variável from
e passá-la para a função., Por favor, note: as mudanças de função from
, mas a mudança não é vista de fora, pois uma função sempre recebe uma cópia do valor:
valores Padrão
Se um parâmetro não for fornecido, então o seu valor torna-se undefined
.
Por exemplo, a já mencionada função showMessage(from, text)
pode ser chamada com um único argumento:
showMessage("Ann");
isso não é um erro. Tal chamada produziria "*Ann*: undefined"
., Não há text
, então assume-se que text === undefined
.,
Se quisermos usar um “padrão” text
neste caso, então podemos especificá-lo depois de =
:
function showMessage(from, text = "no text given") { alert( from + ": " + text );}showMessage("Ann"); // Ann: no text given
Agora, se o text
parâmetro não for passado, ele irá obter o valor de "no text given"
Aqui "no text given"
é uma seqüência de caracteres, mas pode ser uma expressão mais complexa, que só é avaliada e atribuído se o parâmetro estiver ausente., Então, isso também é possível:
em JavaScript, um parâmetro padrão é avaliado cada vez que a função é chamada sem o respectivo parâmetro.
No exemplo acima, anotherFunction()
é chamado toda vez que showMessage()
é chamado sem o text
parâmetro.
parâmetros predefinidos alternativos
por vezes faz sentido definir valores predefinidos para parâmetros não na declaração da função, mas numa fase posterior, durante a sua execução.,parâmetro, podemos compará-la com undefined
:
function showMessage(text) { if (text === undefined) { text = 'empty message'; } alert(text);}showMessage(); // empty message
…Ou podemos usar o ||
operadora:
// if text parameter is omitted or "" is passed, set it to 'empty'function showMessage(text) { text = text || 'empty'; ...}
Moderna JavaScript motores de apoio a nullish de coalescência operador ??
, é melhor quando falsy valores, como 0
, são considerados regulares:
Retornar um valor
uma função pode retornar Um valor para o código de chamada como o resultado.,
O exemplo mais simples seria uma função que soma dois valores:
function sum(a, b) { return a + b;}let result = sum(1, 2);alert( result ); // 3
A diretiva return
pode ser em qualquer lugar da função. Quando a execução chega a ela, a função pára, e o valor é devolvido ao código de chamada (atribuído a result
acima).
pode haver muitas ocorrências de return
em uma única função. Por exemplo:
é possível usar return
sem um valor., That causes the function to exit immediately.
For example:
function showMovie(age) { if ( !checkAge(age) ) { return; } alert( "Showing you the movie" ); // (*) // ...}
In the code above, if checkAge(age)
returns false
, then showMovie
won’t proceed to the alert
.,
return
e o valor dePor um longo expressão return
, pode ser tentador para colocá-lo em uma linha separada, como este:
return (some + long + expression + or + whatever * f(a) + f(b))
Que não funciona, porque o JavaScript assume um ponto-e-vírgula depois de return
. Isso funcionará da mesma forma que:
return; (some + long + expression + or + whatever * f(a) + f(b))
assim, ele efetivamente se torna um retorno vazio.,
Se quisermos que a expressão devolvida se envolva em várias linhas, devemos iniciá-la na mesma linha que return
. Ou, pelo menos, colocar os parêntesis de abertura do seguinte modo:
return ( some + long + expression + or + whatever * f(a) + f(b) )
e irá funcionar tal como esperamos que funcione.
nomear uma função
funções são acções. Então o nome deles costuma ser um verbo. Deve ser breve, o mais preciso possível e descrever o que a função faz, de modo que alguém lendo o código obtém uma indicação do que a função faz.,
é uma prática generalizada iniciar uma função com um prefixo verbal que descreve vagamente a ação. Deve haver um acordo dentro da equipe sobre o significado dos prefixos.
Por exemplo, funções que começam com"show"
geralmente mostram algo.
função começando com …
exemplos de tais nomes:
com prefixos no lugar, um olhar para um nome de função dá uma compreensão do tipo de trabalho que ele faz e que tipo de valor ele retorna.,
uma função deve fazer exatamente o que é sugerido pelo seu nome, não mais.
duas ações independentes geralmente merecem duas funções, mesmo se elas são normalmente chamadas juntas (nesse caso, podemos fazer uma terceira função que chama essas duas).
a few examples of breaking this rule:
-
getAge
– would be bad if it shows analert
com a idade (should only get)., - – seria mau se modificasse o documento, adicionando-lhe um formulário (só deveria criá-lo e retornar).
-
checkPermission
– seria mau se exibisse a mensagemaccess granted/denied
(só deverá efectuar a verificação e devolver o resultado).
estes exemplos assumem significados comuns de prefixos. Você e sua equipe são livres para concordar com outros significados, mas geralmente eles não são muito diferentes. Em qualquer caso, você deve ter uma compreensão firme do que um prefixo significa, o que uma função prefixada pode e não pode fazer., Todas as funções com prefixos iguais devem obedecer às regras. E a equipa deve partilhar o conhecimento.
funções que são usadas muitas vezes têm nomes de ultrashort.
Por exemplo, a estrutura jQuery define uma função com $
. A Biblioteca Lodash tem sua função principal chamada _
.estas são excepções. Geralmente funções nomes devem ser concisos e descritivos.
funções = Os comentários
funções devem ser curtos e fazer exatamente uma coisa., Se essa coisa é grande, talvez valha a pena dividir a função em algumas funções menores. Às vezes seguir esta regra pode não ser tão fácil, mas é definitivamente uma coisa boa.
uma função separada não é apenas mais fácil de testar e depurar-a sua própria existência é um grande comentário!
Por exemplo, compare as duas funções showPrimes(n)
abaixo. Cada um produz números primos até n
.,
A primeira variante utiliza uma etiqueta:
function showPrimes(n) { nextPrime: for (let i = 2; i < n; i++) { for (let j = 2; j < i; j++) { if (i % j == 0) continue nextPrime; } alert( i ); // a prime }}
A segunda variante usa uma função adicional isPrime(n)
para testar primalidade:
A segunda variante é mais fácil de entender, não é? Em vez da peça de código, vemos um nome da ação (isPrime
). Às vezes as pessoas se referem a tal código como auto-descrição.
assim, as funções podem ser criadas mesmo que não tencionemos reutilizá-las. Eles estruturam o código e tornam-no legível.,
Resumo
Uma declaração de função se parece com isso:
function name(parameters, delimited, by, comma) { /* code */}
- Valores passados para uma função como parâmetros são copiados para suas variáveis locais.uma função pode aceder a variáveis externas. Mas só funciona de dentro para fora. O código fora da função não vê suas variáveis locais.
- uma função pode retornar um valor. Se não o fizer, então seu resultado é
undefined
.,
para tornar o código limpo e fácil de entender, recomenda-se a utilização principalmente de variáveis e parâmetros locais na função, não variáveis externas.
é sempre mais fácil compreender uma função que obtém parâmetros, trabalha com eles e retorna um resultado do que uma função que não obtém parâmetros, mas modifica variáveis externas como um efeito colateral.
Nome da função:
- um nome deve descrever claramente o que a função faz. Quando vemos uma função chamada no código, um bom nome instantaneamente nos dá uma compreensão do que ele faz e retorna.,
- uma função é uma ação, por isso os nomes das funções são geralmente verbais.
- existem muitos conhecidos função de prefixos como
create…
show…
get…
check…
e assim por diante. Use-os para sugerir o que uma função faz.
funções são os principais blocos de construção de scripts. Agora nós cobrimos o básico, então nós realmente podemos começar a criá-los e usá-los. Mas isso é apenas o início do caminho. Nós vamos voltar para eles muitas vezes, indo mais profundamente em suas características avançadas.
Deixe uma resposta