Funções em JavaScript
Aprenda a criar blocos de código reutilizáveis que organizam seu
programa, evitam repetição e tornam o desenvolvimento muito mais
eficiente.
O que é uma Função?
Um bloco de código com propósito
Uma função é como um
eletrodoméstico: você aperta um botão,
ele executa uma tarefa e entrega um
resultado. Em programação acontece a
mesma coisa:
Chamada Execução Resultado
A função é invocada no código As instruções internas são Pode ou não retornar um valor
processadas
Sintaxe Básica
Como escrever sua primeira função
A estrutura de uma função em JavaScript segue um padrão simples:
function saudacao() {
[Link]("Olá, seja bem-vindo!");
}
// Para executar:
saudacao();
// Resultado:
// Olá, seja bem-vindo!
A palavra-chave function indica que estamos criando uma função. O nome escolhido deve descrever o que ela faz. Os
parênteses () e as chaves {} são obrigatórios.
O que uma função pode
fazer?
Funções são versáteis e cobrem diferentes necessidades do seu
programa.
Capacidade 1
Executar uma ação
A função mais simples apenas executa
uma ação quando chamada, sem
precisar de dados externos nem
devolver nada.
function ligarLampada() {
[Link]("Lâmpada
ligada");
}
ligarLampada();
Capacidade 2
Realizar cálculos
function somar() {
[Link](5 + 10);
}
somar();
// Resultado: 15
Mesmo sem receber valores externos, a função pode conter operações matemáticas internas. Útil quando os valores
são fixos e conhecidos antecipadamente.
Capacidade 3
Receber informações (Parâmetros)
Parâmetros permitem que a função
receba dados variáveis a cada chamada,
tornando-a muito mais flexível e
reutilizável.
function apresentar(nome)
{
[Link]("Olá " +
nome);
}
apresentar("Maria");
// Resultado: Olá Maria
Capacidade 4
Retornar resultados
function multiplicar(a, b) {
return a * b;
}
let resultado = multiplicar(4, 5);
[Link](resultado);
// Resultado: 20
A palavra return faz a função devolver um valor que pode ser armazenado em uma variável ou usado diretamente
em outra expressão. Isso é muito poderoso!
Tipos de Funções
6 formas de criar funções em JavaScript
Simples
1 Forma tradicional
Com Parâmetros
2 Recebe dados
Com Retorno
3 Devolve valor
Anônima
4 Sem nome próprio
Arrow Function
5 Sintaxe moderna ES6
IIFE
6 Autoexecutável
Tipo 1
Função Simples
É a forma tradicional de declarar uma função. Possui nome, Estrutura
parênteses e um bloco de instruções entre chaves. Ideal
para iniciantes. • function — palavra-chave obrigatória
• mensagem — nome da função
• () — lista de parâmetros (vazia aqui)
function mensagem() { • { } — bloco de código a executar
[Link]("Bom dia!");
}
mensagem();
// Resultado: Bom dia!
Tipo 2
Função com Parâmetros
function calcularArea(base, altura) {
[Link](base * altura);
}
calcularArea(10, 5);
// Resultado: 50
Os parâmetros são variáveis definidas na criação da função. Os argumentos são os valores reais passados na chamada. Aqui,
base = 10 e altura = 5.
Tipo 3
Função com Retorno
function media(n1, n2) { Sem o return, a função executa o cálculo mas o
return (n1 + n2) / 2; resultado se perde. Com o return, o valor fica
} disponível para ser usado em qualquer parte do
programa.
let notaFinal = media(8, 10);
[Link](notaFinal);
// Resultado: 9 O valor retornado pode ser armazenado em uma variável,
exibido direto ou passado para outra função.
Tipo 4
Função Anônima
let saudar = function() {
[Link]("Olá!");
}
saudar();
// Resultado: Olá!
Uma função anônima não tem nome próprio — ela é atribuída a uma variável. É muito utilizada como argumento de
outras funções, como em eventos de clique ou chamadas assíncronas.
Tipo 5
Arrow Function
Introduzida no ES6, a Arrow Function é uma forma mais moderna e
concisa de escrever funções, muito usada no JavaScript atual.
Arrow Function — na prática
Sintaxe completa e versão reduzida
Forma completa Versão reduzida
const somar = (a, b) => { const somar = (a, b) => a + b;
return a + b;
} [Link](somar(5, 3));
// Resultado: 8
[Link](somar(5, 3));
// Resultado: 8
Quando a função tem apenas uma expressão, as
chaves e o return podem ser omitidos. O
resultado é retornado automaticamente.
Tipo 6
Função Autoexecutável (IIFE)
(function() {
[Link]("Executou automaticamente");
})();
// Resultado: Executou automaticamente
A IIFE (Immediately Invoked Function Expression) é uma função que se executa sozinha assim que é criada, sem precisar ser
chamada. Muito usada para isolar código e evitar conflitos de variáveis.
Exemplos do Cotidiano
Funções em situações reais
Caixa Eletrônico Calculadora
Consultar saldo Somar valores
Loja Online Sistema Escolar
Calcular total Verificar aprovação
Login Orçamento
Verificar acesso Calcular custos
Exemplo 1
Caixa Eletrônico
Quando o cliente solicita o saldo, o sistema
chama uma função específica para isso:
function consultarSaldo() {
[Link]("Seu saldo é
R$ 1.500");
}
consultarSaldo();
// Seu saldo é R$ 1.500
Em sistemas reais, essa função consultaria
um banco de dados e retornaria o valor
dinâmico.
Exemplo 2 e 3
Calculadora e Loja Online
Calculadora Loja Online
function somar(a, b) { function calcularTotal(preco, qtd) {
return a + b; return preco * qtd;
} }
[Link](somar(10, 20)); let total = calcularTotal(100, 3);
// Resultado: 30 [Link](total);
// Resultado: 300
Exemplo 4
Sistema Escolar — Verificar Aprovação
function
verificarAprovacao(media)
{
if(media >= 7) {
return "Aprovado";
}
return "Reprovado";
}
[Link](verificarAprov
acao(8));
// Resultado: Aprovado
Exemplo 5
Sistema de Login
function login(usuario, senha) {
if(usuario === "admin" && senha === "123") {
return "Acesso permitido";
}
return "Acesso negado";
}
[Link](login("admin", "123"));
// Resultado: Acesso permitido
Perceba que a função verifica duas condições ao mesmo tempo com o operador &&. Só retorna acesso permitido se ambas
forem verdadeiras. Esse é um exemplo claro de lógica encapsulada em função.
Exemplo 6
Sistema de Orçamento — com e sem função
Sem função Com função
let total = 5 * 100; function calcularOrcamento(qtd, valor) {
[Link](total); return qtd * valor;
// 500 }
let resultado = calcularOrcamento(5, 100);
Funciona, mas o código fica solto, difícil de reutilizar e de
[Link](resultado);
entender em projetos maiores.
// 500
Reutilizável, legível e fácil de manter.
Vantagens das Funções
Funções são fundamentais para escrever código de qualidade
profissional.
Por que usar funções?
6 vantagens essenciais
Evitam repetição Organizam o código
Escreva uma vez, use várias vezes Cada função tem uma responsabilidade clara
Facilitam manutenção Melhoram leitura
Correções em um único lugar Código mais claro e compreensível
Permitem reutilização Escalam sistemas
Lógica aproveitada em todo o projeto Essenciais em projetos grandes
Resumo Final
O que aprendemos hoje
Definição
Tipos Parâmetros
Retorno
Funções são a base do JavaScript moderno. Elas estão presentes em sites, apps, sistemas bancários, lojas virtuais e redes sociais — em praticamente qualquer software
que você usar.