capitulo_07_funcoes

Capítulo 07: Funções e Arrow Functions 🪓❄️

Neste capítulo, vamos aprender a criar blocos de código reutilizáveis chamados Funções, com foco na sintaxe moderna de Arrow Functions, com o tema God of War!

---

📖 O que são Funções?

Funções são blocos de construção fundamentais em JavaScript. Elas permitem que você agrupe um conjunto de instruções para executar uma tarefa.

Arrow Functions

As Arrow Functions (() => {}) são uma forma mais curta e moderna de escrever funções em JavaScript, introduzidas no ES6.

---

📖 Exemplo Guiado: Ataque do Kratos

Vamos criar uma função tradicional e uma arrow function para calcular o dano de um ataque.

1. Crie o arquivo ataque_kratos.js na pasta src/:

// Função Tradicional
function calcularDanoTradicional(forca, bonus) {
    return forca + bonus;
}
 
// Arrow Function (Forma moderna)
const calcularDanoArrow = (forca, bonus) => forca + bonus;
 
const forcaBase = 50;
const bonusFuria = 25;
 
console.log("Kratos atacou com as Laminas do Caos!");
console.log(`Dano (Tradicional): ${calcularDanoTradicional(forcaBase, bonusFuria)}`);
console.log(`Dano (Arrow): ${calcularDanoArrow(forcaBase, bonusFuria)}`);

🕹️ Como Executar e Testar no VS Code

1. Abra o terminal integrado.
2. Execute: node ataque_kratos.js

Resultado Esperado:

Kratos atacou com as Laminas do Caos!
Dano (Tradicional): 75
Dano (Arrow): 75

---

📊 Ilustração Visual: Fluxo da Função

Veja como o controle do programa passa para a função e retorna:

graph TD
    A[Fluxo Principal] -->|1. Chama função| B["Função: calcularDano"]
    B -->|2. Executa a soma| B
    B -->|3. Retorna o resultado| A

---

🛠️ Prática Obrigatória 1: Barra de Vida

Crie uma Arrow Function chamada exibirVida que receba um número de vida e exiba uma barra visual (ex: se a vida for 80, exibe Vida: [||||||||] 80%). Use um laço dentro da função ou o método .repeat() de strings!

---

🔑 Gabarito de Código

Prática 1: barra_vida.js

const exibirVida = (vida) => {
    const barras = "|".repeat(vida / 10);
    console.log(`Vida: [${barras}] ${vida}%`);
};
 
const vidaKratos = 80;
exibirVida(vidaKratos);

---

📤 Instruções de Entrega (GitHub Desktop + Microsoft Teams)

(Siga o padrão estabelecido no Guia)

---

← Capitulo Anterior | Proximo Capitulo →