⚡ Funções Avançadas

Arrow Functions, Callbacks, Closures e Escopo

Progresso do Tópico

Completar os exercícios para avançar no curso

⚙️ 2. Funções

Visão Geral: Funções em JavaScript são blocos de código reutilizáveis que podem ser chamados com diferentes entradas (parâmetros) para produzir saídas (retornos). São fundamentais na programação moderna e aparecem em várias formas: declaradas, expressas, anônimas, arrow, etc.

2.1 Declaração de função

function saudacao() { console.log("Olá, mundo!"); } saudacao();
Curiosidade: Funções declaradas são "elevadas" no código (hoisting), ou seja, podem ser chamadas antes da definição.

2.2 Expressão de função

const soma = function(a, b) { return a + b; }; console.log(soma(2, 3)); // 5
Expressões não são içadas como declarações. Devem ser definidas antes de usadas.

2.3 Função anônima

Exemplo embutido em um setTimeout:
setTimeout(function() { console.log("Executado após 1 segundo"); }, 1000);

2.4 Arrow function

const dobrar = (n) => n * 2; console.log(dobrar(5)); // 10
Arrow functions não possuem seu próprio this, arguments, super ou new.target.
🧪 Demonstração: Tipos de Funções
// Resultados aparecerão aqui

2.5 Parâmetros e argumentos

function exibirMensagem(nome, idade) { console.log(`Olá ${nome}, você tem ${idade} anos.`); } exibirMensagem("Maugus", 30);

2.6 Return

function multiplicar(x, y) { return x * y; } let resultado = multiplicar(4, 5); console.log(resultado); // 20
Após o return, nada mais é executado dentro da função.

2.7 Escopo

let cor = "azul"; function mudarCor() { let cor = "vermelho"; console.log("Dentro: ", cor); // vermelho } mudarCor(); console.log("Fora: ", cor); // azul
Variáveis declaradas dentro de uma função têm escopo local e não interferem nas externas.
🧪 Demonstração: Escopo de Variáveis
// Teste de escopo aparecerá aqui

2.8 Funções como objetos de primeira classe

Em JavaScript:
  • Funções podem ser atribuídas a variáveis
  • Podem ser passadas como argumentos
  • Podem ser retornadas por outras funções
function aplicarOperacao(a, b, operacao) { return operacao(a, b); } function somar(x, y) { return x + y; } console.log(aplicarOperacao(3, 4, somar)); // 7

2.9 Funções de callback (.extra)

function processarUsuario(nome, callback) { console.log("Processando usuário " + nome); callback(); } processarUsuario("Ana", function() { console.log("Função de callback executada!"); });
Callbacks são muito usadas em eventos, temporizadores, e programação assíncrona.
🧪 Demonstração: Callbacks e Primeira Classe
// Resultados dos callbacks aparecerão aqui

2.10 Funções recursivas (.extra)

function contagemRegressiva(n) { if (n <= 0) { console.log("Boom!"); return; } console.log(n); contagemRegressiva(n - 1); } contagemRegressiva(5);
Toda recursão deve ter uma condição de parada, ou causará um loop infinito.
🧪 Demonstração: Função Recursiva
// Resultados da recursão aparecerão aqui

🧠 Resumo

Tipo Característica Exemplo
Declarada Hoisting disponível function nome() {}
Expressão Sem hoisting const nome = function() {}
Arrow Sem próprio this const nome = () => {}
Callback Passada como argumento setTimeout(callback, 1000)
Recursiva Chama a si mesma function fact(n) { return n * fact(n-1) }

📋 Perguntas de Revisão

1. O que é hoisting e como afeta declarações de função?

Hoisting permite que funções declaradas sejam chamadas antes de serem definidas no código.

2. Qual a diferença entre função declarada e expressão de função?

Funções declaradas têm hoisting, expressões não. Expressões devem ser definidas antes do uso.

3. Quando usar arrow function?

Para funções simples ou quando não precisamos do próprio contexto this.

4. O que torna uma função de primeira classe?

Pode ser atribuída a variáveis, passada como argumento e retornada por outras funções.

5. Como funciona uma função recursiva?

Chama a si mesma até atingir uma condição de parada para evitar loop infinito.