Publicado em

JavaScript: Trabalhando com Funções

JavaScriptVocê já deve saber que JavaScript é uma linguagem funcional, e uma das suas principais características é a (extensa) utilização de funções para realizar tarefas.

Neste tutorial, você vai aprender o que são as funções, como criá-las e como utilizar os argumentos para modificar o comportamento de trechos do seu código.

Ao final, você vai ter entendido as funções e já conseguirá modularizar seus scripts e reaproveitar código.


O que é uma Função?

Uma função é um conjunto de instruções que podem ser executados sempre a tal função for chamada. JavaScript é uma linguagem funcional, então, você vai usar muito as funções, e deve entendê-las bem.

As funções possibilitam a reutilização de código, já que você pode chamar a função várias vezes de dentro de seu código. As funções podem, também, ter parâmetros, que permitem que você passe dados para a função.

Funções também podem ter um valor de retorno, para que você possa retornar os resultados de uma operação (ou várias) para o código que a chamou.


Como Declarar Funções

Uma função deve ser declarada usando a palavra-chave function e, em seguida, definindo um nome (também conhecido como identificador).

Você também pode definir uma lista (opcional) de parâmetros entre parênteses. As instruções da função são delimitadas por uma chave de abertura e uma de fechamento:

function nomeDaFuncao(parametros) {
 // instrucoes
}

Veja um exemplo mais prático:

/**
 * Soma dois valores
 */
function sum(a, b) {
 return a + b;
}

Este é um exemplo de uma declaração de função, em que a função é denominada sum() e tem dois parâmetros, a e b.

Essa função tem um conjunto de instruções, delimitado pelas chaves (isso também é conhecido como “bloco de código”). Esta função tem apenas uma instrução, mas poderia ter várias outras.

Quando você chama uma função no seu código, você está invocando ou aplicando a função. Um exemplo de chamada, invocação, ou aplicação da função sum() seria assim:

var x = 5;
var y = 10;
var result = sum(x, y);

Neste exemplo, três variáveis foram declaradas.

As variáveis a e b são inicializados com dados a serem passados como argumentos para a função Adicionar. Variável c irá conter o valor de retorno da função sum().

A função sum() receberá os argumentos em seu parâmetros x e y. Finalmente, a instrução de retorno irá adicionar x e y e retornar o resultado, que é atribuído à variável c.

Diferença entre Argumento e Parâmetro

Uma função pode ser chamada antes que a ela seja declarada.  Isso é possível porque as declarações de função são resolvidas quando o JavaScript é lido, ou seja, na hora do parsing.

O exemplo abaixo pode ser executado sem problemas, mesmo que a função sum() seja chamada antes da função ser declarada:

var x = 5;
var y = 10;
var result = sum (x, y);

function sum(a, b) {
 return a + b;
}

Usando Funções como Expressões

Outra forma de escrever funções é no formato de expressão, ou expressão de função.

Uma expressão de função produz um valor do tipo function. E, você pode atribuir expressões de função para variáveis ou executá-las diretamente. Veja, abaixo, de uma expressão de função sendo criada e atribuída a uma variável:

var sumFunction = function(a, b) {
 return a + b;
};

var result = sumFunction(5, 10);

Primeiro, observe que sumFunction é chamado após a expressão função é atribuída à variável sumFunction . Se você tentar chamar sumFunction antes da atribuição da expressão de função para a variável sumFunction , uma exceção será lançada.

A variável sumFunction é do tipo function, em que a expressão de função é criado usando a palavra-chave função para criar uma função sem nome (também conhecido como uma função anônima), e depois a expressão função é atribuída à variável. Uma função anônima não tem nome ou identificador. Embora as expressões de função pode ser nomeado ou anônimo, é considerado melhor deixar a função anônima para minimizar a confusão.

As expressões de função podem ser benéficas quando você deseja determinar o código condicionalmente a ser executado em tempo de execução.

Aqui está um exemplo de quando você pode adicionar dois valores ou subtrair um valor a partir do outro:

var myFunction = function(x, y){
 return x + y;
};

//lots of code
var c = myFunction(10, 5);

//lots of code
myFunction = function(x, y){
 return x - y;
};

//lots of code;
var d = myFunction(10,5);

Neste exemplo, a variável c será atribuído um valor de 15, porque myFunction foi declarada e código que adiciona x e y atribuído. d variável é atribuído o valor de 5 por causa myFunction foi designado novo código que subtrai y de x.


Cuidados com Argumentos

O JavaScript é bastante flexível com a passagem de argumentos para funções. Se você passar argumentos a mais, o JavaScript descarta os extras. Se você não passar todos os argumentos, o valor dos parâmetros ausentes será undefined.

O maior benefício deste comportamento é que você pode adicionar parâmetros para uma função que já foi criada e já está sendo chamada. Os parâmetros adicionados podem fornecer novas funcionalidades, e as chamadas que já existiam continuarão a funcionar.

A desvantagem deste comportamento é que você pode passar uma quantidade incorreta de argumentos para a função, e não receberá nenhum aviso de problema.

2 comentários sobre “JavaScript: Trabalhando com Funções

  1. Muito bom.
    *** Somente uma observação: no exemplo é exibida a função “sumFunction”, porém no texto a função é referenciada como “addFunction”.

    1. Obrigado, Bruno! Já vou revisar e corrigir essa parte.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *