Fu

Funções em JavaScript

6 exercícios

Sobre Funções

Uma função é um bloco de código organizado e reutilizável que serve para executar uma determinada ação. Existem várias formas de definir funções em JavaScript. Aqui vamos ver declarações de função e expressões de função. Outras possibilidades, como as funções arrow, serão abordadas noutros conceitos.

Declaração de função

A forma padrão de definir uma função em JavaScript é a declaração de função, também chamada definição de função ou instrução de função.

É composta pela palavra-chave function, pelo nome da função e por uma lista de parâmetros separados por vírgulas, entre parênteses. A seguir vem o corpo da função (o conjunto de instruções que define o que a função faz), entre chavetas.

function someName(param1, param2, param3) {
  // ...
}

Utilizar uma função

Em JavaScript, uma função é invocada (chamada) indicando o nome da função seguido de parênteses que contêm os argumentos.

someName(arg1, arg2, arg3);

Em JavaScript, escrever apenas o nome da função não chama a função.

function sayHello() {
  console.log('Hello, World!');
}

sayHello;
// => [Function: sayHello]
// The text representations varies between environments.

sayHello();
// => 'Hello, World!'

Parâmetros

Ao trabalhares com parâmetros dentro do corpo da função, tem em atenção os possíveis efeitos secundários sobre o valor original que foi passado à função. Em JavaScript, um argumento é uma cópia de uma referência ao valor original. O que isto significa na prática depende do tipo de dados do argumento.

  • Os valores de tipos de dados primitivos são imutáveis. Todas as "modificações" criam sempre um novo valor primitivo. Por isso, o valor original nunca é afetado pelo que acontece ao argumento dentro do corpo da função.

    const num = 0;
    
    function increase(number) {
      number = number + 1;
    }
    
    increase(num);
    num;
    // => 0
    
  • Com valores como objetos, arrays e funções é diferente. Como a referência é copiada, uma reatribuição não afeta o valor original. No entanto, como estás a lidar com uma cópia superficial, modificar o argumento dentro do corpo da função também altera o valor original que foi passado.

    const nums = [0, 1, 2, 3, 4];
    
    function pushFive(arr) {
      arr.push(5);
    }
    
    pushFive(nums);
    nums;
    // => [0, 1, 2, 3, 4, 5]
    

Por predefinição, todos os parâmetros definidos na declaração da função são opcionais em JavaScript. Se uma função receber menos argumentos do que os parâmetros que tem, os argumentos em falta serão undefined dentro do corpo da função; vê Null e Undefined. Em muitos casos, faz mais sentido inicializar um parâmetro com um valor predefinido quando não é passado nenhum valor ou é passado undefined. Isto pode ser feito indicando parâmetros predefinidos diretamente na definição da função.

function someName(param1 = defaultValue1, param2 = defaultValue2) {
  // ...
}

Uma função pode ser invocada (chamada) com mais argumentos do que os parâmetros que existiam na definição da função. Todos os argumentos, incluindo esses argumentos em excesso, podem ser encontrados no «array» de arguments.

Também é possível definir funções que aceitam um número arbitrário de argumentos (funções variádicas); para mais detalhes, vê os parâmetros rest em Operadores Rest e Spread.

Instrução return

Uma instrução return termina a execução da função e especifica um valor a devolver a quem chamou a função. Uma função pode ter várias instruções return.

function checkNumber(num) {
  if (num === 0) {
    return 'You passed 0, please provide another number.';
  }

  return 'Thanks for passing such a nice number.';
}

O resultado de uma função que não devolve nenhum valor com return ou que não tem nenhuma instrução return é undefined. Em JavaScript não existem return implícitos.

function nakedReturn(a) {
  a * 2;
  return;
}

nakedReturn(1);
// => undefined

function noReturn(a) {
  a * 2;
}

noReturn(1);
// => undefined

Em JavaScript, só podes devolver exatamente um valor. Se quiseres passar mais informação, tens de a combinar primeiro numa única entidade, normalmente num objeto ou num array.

function divide(a, b) {
  return {
    quotient: Math.floor(a / b),
    remainder: a % b,
  };
}

Expressão de função

Uma declaração de função é uma instrução isolada. Mas, por vezes, é útil definir uma função como parte de outra expressão, por exemplo numa atribuição, como parâmetro de uma função (callback) ou como valor num objeto. Isto pode ser feito com uma expressão de função. Tem a mesma sintaxe que uma declaração de função, só que o nome da função pode ser omitido para criar uma função anónima.

const someFunction = function (param) {
  // ...
};

someOtherFunction(function (param) {
  // ...
});

const obj = {
  someFunction: function (param) {
    // ...
  },
};

Âmbito

Uma função introduz um novo contexto de execução em JavaScript. As variáveis definidas dentro de uma função não são acessíveis fora dessa função. Mas as variáveis definidas no âmbito superior (o âmbito onde a própria função foi definida) são acessíveis dentro da função. A documentação da MDN sobre o âmbito mostra exemplos deste comportamento.

Dá uma vista de olhos às closures para saberes mais sobre o âmbito das variáveis em JavaScript.

Editar via GitHub A ligação abre numa nova janela ou separador

Aprende Funções