Complementando os demais, acho que é importante saber a ideia geral (o que de fato é uma função), pois esse conceito vale para qualquer linguagem (inclusive JavaScript). O que muda de uma linguagem para outra são alguns detalhes, mas a ideia básica é essencialmente a mesma.
Resumindo bem grosseiramente, uma função nada mais é que um bloco de código que pode ser reutilizado.
Por exemplo, vamos supor que eu tenha vários números que correspondem a valores em dólar, e eu quero mostrá-los tanto em dólar quanto convertidos para reais. Ou seja, se o valor é 1.5 (1 dólar e 50 cents), eu quero mostrá-lo como "R$ 8,43" (assumindo que a cotação é 5,62).
Uma versão inicial em JavaScript seria assim:
// valores em dólares
var preco = 15.9;
var desconto = 5;
var valorFinal = preco - desconto;
// converter para reais
var taxaConversao = 5.62;
precoReais = preco * taxaConversao;
console.log('Preço dólares:', preco.toLocaleString('en-US', { style: 'currency', currency: 'USD' }));
console.log('Preço reais:', precoReais.toLocaleString('pt-BR', { style: 'currency', currency: 'BRL' }));
descontoReais = desconto * taxaConversao;
console.log('Desconto dólares:', desconto.toLocaleString('en-US', { style: 'currency', currency: 'USD' }));
console.log('Desconto reais:', descontoReais.toLocaleString('pt-BR', { style: 'currency', currency: 'BRL' }));
valorFinalReais = valorFinal * taxaConversao;
console.log('Valor Final dólares:', valorFinal.toLocaleString('en-US', { style: 'currency', currency: 'USD' }));
console.log('Valor Final reais:', valorFinalReais.toLocaleString('pt-BR', { style: 'currency', currency: 'BRL' }));
Por ora, para entender o código, saiba que
toLocaleStringserve para formatar o número, e os parâmetros seguintes indicam como formatá-lo. No caso,en-USept-BRsão locales que correspondem ao inglês americano e português brasileiro, o que neste caso muda o separador decimal (ponto ou vírgula). Já ostyle: 'currency'indica que é um valor monetário, ecurrencyindica se é dólar ("USD") ou real ("BRL"). Isso não é essencial para entender funções no momento, então continuemos...
A saída será algo como:
Preço dólares: $15.90
Preço reais: R$ 89,36
Desconto dólares: $5.00
Desconto reais: R$ 28,10
Valor Final dólares: $10.90
Valor Final reais: R$ 61,26
Mas reparou que há muito código repetitivo? Para cada um dos valores eu faço basicamente a mesma coisa: mostro em dólares, multiplico pela taxa de conversão e mostro em reais. Exatamente a mesma coisa. Se eu quisesse mudar a mensagem, ou alguma opção de formatação (por exemplo, mostrar a terceira casa decimal, que em muitos contextos é relevante), eu teria que mudar em todos eles.
Sendo assim, eu poderia pegar este trecho repetitivo e jogar em uma função:
function mostrarDolaresReais(valor, taxaConversao, nome) {
var convertido = valor * taxaConversao;
console.log(`{nome} dólares:`, valor.toLocaleString('en-US', { style: 'currency', currency: 'USD' }));
console.log(`{nome} reais:`, convertido.toLocaleString('pt-BR', { style: 'currency', currency: 'BRL' }));
}
// valores em dólares
var preco = 15.9;
var desconto = 5;
var valorFinal = preco - desconto;
// converter para reais
var taxaConversao = 5.62;
mostrarDolaresReais(preco, taxaConversao, 'Preço');
mostrarDolaresReais(desconto, taxaConversao, 'Desconto');
mostrarDolaresReais(preco - desconto, taxaConversao, 'Valor Final');
E pronto, todo o código repetitivo foi jogado para a função. E a parte que varia (ou seja, os valores e a mensagem) é passada como parâmetros.
Ou seja, quando eu chamo a função assim: mostrarDolaresReais(preco, taxaConversao, 'Preço'); - estou dizendo que o parâmetro valor terá o valor da variável preco, a taxaConversao terá o valor da taxa de conversão (usei o mesmo nome dentro e fora da função, mas eles não são a mesma variável - talvez isso te confunda agora, mas fica uma dica para se aprofundar depois). E a string 'Preço' será atribuída ao parâmtro nome. Assim, dentro da função ela executa com estes valores.
Depois as chamadas seguintes fazem o mesmo, mas para o desconto e o valor final. Repare inclusive que eu posso passar diretamente o valor de preco - desconto: se eu não for usar esse valor para mais nada depois, nem precisa da variável valorFinal.
Assim o código fica mais organizado, e também mais fácil de manter - por exemplo, se eu quiser modificar o comportamento da função, ou encontrar algum erro nela, basta alterá-la apenas uma vez. É bem melhor que a versão anterior, na qual eu teria que mudar em três lugares.
E claro que dá para ir além. Por exemplo, as moedas também poderiam ser parâmetros, etc. Tudo depende da necessidade, claro (se é sempre dólar e real, aí não faria sentido parametrizar).
Enfim, a ideia básica é essa. Uma função é um bloco de código que pode ser reutilizado. E como já dito, esse é um conceito que vale para todas as linguagens. O que muda são os detalhes (alguns já foram ditos por outros), mas acho que vc já tem por onde começar.