Page cover

7.7.1 - Funções

🔍 Explorando Funções a Fundo

🔍 Explorando Funções a Fundo

Agora que você já sabe o que são funções e como usá-las, vamos entender como elas funcionam por dentro, como escrever melhor e evitar armadilhas comuns! 🕵️‍♀️


⚙️ Como as funções atuam no computador?

Quando você cria uma função, o computador guarda esse bloco de código na memória, esperando que ele seja chamado. Quando você chama a função, o JavaScript:

  1. Cria um ambiente de execução só dela (com variáveis próprias);

  2. Executa as instruções da função;

  3. Devolve um valor (se tiver return) e volta pra onde parou.

Isso é chamado de "pilha de chamadas" (call stack). Cada vez que uma função é chamada, ela é empilhada. Quando termina, ela sai da pilha.


✍️ Formas de criar uma função

Você pode criar funções de vários jeitos em JavaScript:

🏷️ Declaração tradicional

function dizerOla() {
  console.log("Olá!");
}

💼 Expressão de função

const dizerOi = function() {
  console.log("Oi!");
};

⚡ Arrow function (função de seta)

const dizerEai = () => {
  console.log("E aí!");
};

✅ Dica: arrow functions não têm seu próprio this, então em contextos mais avançados (como objetos ou classes), isso pode mudar o comportamento esperado.


📞 Formas de invocar (chamar) uma função

Forma básica:

minhaFuncao();

Com argumentos:

somar(3, 5);

Dentro de outra função:

function mostrarDobro(n) {
  console.log("Dobro:", dobro(n));
}

Com setTimeout ou setInterval:

setTimeout(() => console.log("Passou 2 segundos!"), 2000);

🌍 Escopo: onde suas variáveis vivem

Escopo é o “mundo” onde as variáveis existem.

🧪 Escopo local

Variáveis criadas dentro da função só existem ali.

function mostrarMensagem() {
  let msg = "Olá!";
  console.log(msg);
}

console.log(msg); // ❌ Erro! msg não existe aqui

🌐 Escopo global

Variáveis criadas fora de funções ficam disponíveis no código todo.

let nome = "Luna";

function cumprimentar() {
  console.log("Oi, " + nome);
}

🎁 Escopo de bloco (com let ou const)

if (true) {
  let numero = 10;
}
console.log(numero); // ❌ Erro! fora do bloco

📛 Nomeando funções: convenções úteis

  • ✅ Use verbos + ação clara: calcularMedia, mostrarMensagem

  • 🐫 Use camelCase: começa minúsculo, depois junta palavras com maiúsculas

  • ❌ Evite nomes genéricos: f1(), teste(), coisa()


🧰 Por que funções são tão importantes?

  • Reutilizam código: escreva uma vez, use sempre!

  • Ajudam a dividir tarefas complexas em pedaços simples

  • Facilitam testes e correções

  • Tornam o código mais legível

💡 Dica de programador: "Código bom é aquele que até seu 'eu do futuro' entende!"


⚠️ Erros comuns (e como evitar)

Erro 😬
Explicação 🧠
Como evitar ✅

Não passar argumentos

A função espera valores, mas nada foi dado

Sempre confira os parâmetros

Esquecer return

Sem return, a função não devolve valor

Verifique se precisa retornar algo

Variáveis fora do escopo

Usar uma variável que não existe naquele contexto

Use let ou const corretamente

Nome confuso

f1, calc, temp... ninguém entende!

Use nomes claros e descritivos


💡 Exemplos reais (com boas e más práticas)

✅ Boa prática: código claro e reaproveitável

function calcularMedia(a, b) {
  return (a + b) / 2;
}

let nota1 = 8;
let nota2 = 6;

console.log("Média:", calcularMedia(nota1, nota2));

❌ Má prática: função mal nomeada e sem clareza

function x(y, z) {
  return y + z / 2;
}

console.log(x(8, 6)); // Confuso!

⚠️ Exemplo com comportamento inesperado

function mostrarMensagem() {
  return console.log("Olá!");
}

let resultado = mostrarMensagem(); // Olá!
console.log(resultado); // undefined 🤔

Mesmo com return, console.log não devolve valor, só exibe no terminal.


🧠 Dicas finais para mandar bem com funções

  • Comece simples: funções com 1 ou 2 tarefas são mais fáceis de entender

  • Sempre pergunte: “Essa parte do código se repete? Posso colocar em uma função?”

  • Use funções para organizar lógica: separar exibição, cálculo, validação etc.

  • Leia erros com calma: o terminal vai te dar dicas valiosas 😉


🚀 Desafio para praticar!

Crie uma função avaliarAluno que receba duas notas e retorne:

  • "Aprovado" se a média for maior ou igual a 7

  • "Recuperação" se for entre 5 e 6.9

  • "Reprovado" se for menor que 5

Exemplo:

avaliarAluno(8, 6); // Aprovado

🎉 Conclusão

Funções são poderosas ferramentas para deixar seu código mais inteligente, organizado e fácil de manter. Com elas, você cria seus próprios comandos personalizados!

“Dominar funções é como aprender truques de mágica: com prática, você pode fazer coisas incríveis com pouco código!”

Last updated