🚀 Capítulo 16: Observer (Tema: Stranger Things)

NOTE

Este capítulo utiliza a temática de Stranger Things para explicar o padrão Observer. O Devorador de Mentes está conectado a todos os monstros; quando ele muda de estado, todos os monstros reagem ao mesmo tempo!


1. 🎯 Objetivo da Aula

Compreender o padrão de projeto Observer (Padrão Comportamental), entendendo como ele define uma dependência de um-para-muitos entre objetos, de modo que quando um objeto muda de estado, todos os seus dependentes são notificados e atualizados automaticamente.

2. 🏢 O Cenário Prático (Seu Desafio)

O Devorador de Mentes (Mind Flayer) quer dominar Hawkins. Ele possui uma mente de colmeia (Hive Mind).

  • Ele é o Sujeito (Subject) central.
  • Os Demogorgons e Demodogs são os Observadores (Observers).

Os monstros ficam espalhados pela floresta. Eles não ficam perguntando toda hora para o Devorador: “O que eu faço agora?“. Em vez disso, eles se “inscrevem” na mente dele. Quando o Devorador grita "ATACAR!", todos os monstros recebem a notificação e atacam instantaneamente! Seu desafio é criar esse sistema de rádio/notificação onde todos os monstros escutam o líder!

3. 🧠 Fundamentos: A Teoria Traduzida

O Observer (Observador) é um padrão de projeto comportamental que permite que você defina um mecanismo de assinatura para notificar múltiplos objetos sobre quaisquer eventos que aconteçam com o objeto que eles estão observando.

📡 Sujeito e Observadores:

  1. Sujeito (Subject): É o objeto que possui o estado principal e a lista de quem está escutando ele. Ele tem métodos para inscrever(), desinscrever() e notificar().
  2. Observadores: São os objetos que querem saber quando o estado do sujeito muda. Eles têm um método atualizar().

4. 📖 Exemplo Guiado: A Mente de Colmeia (JS)

// O SUJEITO (Devorador de Mentes)
class DevoradorDeMentes {
    constructor() {
        this.monstros = []; // Lista de observadores
    }
 
    inscrever(monstro) { this.monstros.push(monstro); }
 
    desinscrever(monstro) {
        this.monstros = this.monstros.filter(m => m !== monstro);
    }
 
    gritar(comando) {
        console.log(`\nDevorador de Mentes ordena: ${comando}`);
        // Notifica todos os monstros!
        this.monstros.forEach(monstro => monstro.atualizar(comando));
    }
}
 
// OS OBSERVADORES (Monstros)
class Demogorgon {
    constructor(nome) { this.nome = nome; }
    atualizar(comando) {
        console.log(`${this.nome} recebeu o comando e vai ${comando}!`);
    }
}
 
// USO
const lider = new DevoradorDeMentes();
const demo1 = new Demogorgon("Demogorgon da Floresta");
const demo2 = new Demogorgon("Demogorgon do Laboratório");
 
lider.inscrever(demo1);
lider.inscrever(demo2);
 
lider.gritar("PROCURAR A ELEVEN");
 
// Se um monstro morrer ou se desconectar
lider.desinscrever(demo2);
 
lider.gritar("RECUAR");

5. 🛠️ Prática Obrigatória 1: O Rádio de Hawkins

Os meninos (Dustin, Lucas, Mike) usam walkie-talkies.

  1. Se o Dustin quiser avisar a todos que encontrou um monstro, quem é o Sujeito e quem são os Observadores nessa conversa de rádio?
  2. O que acontece se o Mike desligar o rádio dele (se desinscrever) e o Dustin der o aviso?

6. 🛠️ Prática Obrigatória 2: Observer no Youtube

Dizemos que o botão “Inscrever-se” do Youtube é o exemplo perfeito do padrão Observer. Explique quem é o Sujeito, quem são os Observadores e qual é o evento de notificação nesse caso.


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

  1. Faça o Commit: No GitHub Desktop, digite a mensagem (ex: Finaliza Capítulo 16 Paradigmas) e clique em Commit to main.
  2. Envie para a Nuvem (Push): Clique em Push origin.

8. 📂 Estrutura de Pastas

mod_10_paradigmas_e_padroes_de_projeto/
├── capitulos/
│   ├── capitulo_16_observer.md
│   └── codigos/
│       └── cap16/
│           └── hive_mind.js

💡 Checkpoint de Lógica

O padrão Observer evita o acoplamento forte. O Devorador de Mentes não precisa saber os detalhes de como cada monstro ataca; ele só precisa saber que todos eles têm o método atualizar().

10. 🔥 Desafio de Fixação

Pesquise como o padrão Observer é a base para o desenvolvimento de interfaces reativas em frameworks como Vue.js ou React (onde a tela atualiza sozinha quando o dado muda).

🔑 Gabarito de Código/Fórmulas

Gabarito da Prática 1:

  1. O Dustin (ou o rádio dele que transmite) é o Sujeito. Os outros meninos com os rádios ligados são os Observadores.
  2. O Mike não receberá o aviso, pois seu rádio não está na lista de escuta do sistema naquele momento.

Capitulo Anterior | Proximo Capitulo