DEV Community

Cover image for Design Patterns: Padrões de Projeto no Mundo Real! 🏢💡
Gustavo H. J.
Gustavo H. J.

Posted on

Design Patterns: Padrões de Projeto no Mundo Real! 🏢💡

Introdução:

👋 Olá, desenvolvedores! Neste artigo, vamos explorar alguns padrões de projeto do mundo real que podem ser aplicados no seu código. Esses padrões são soluções comprovadas para problemas recorrentes, garantindo um código mais estruturado, flexível e de fácil manutenção. Prepare-se para mergulhar em exemplos práticos e descobrir como esses padrões podem tornar o seu código mais poderoso! Vamos lá! 😄🚀


1. Singleton (O Solitário) 🕴️

O padrão Singleton é como um CEO de uma grande empresa. Ele garante que apenas uma instância de uma classe seja criada e fornece um ponto de acesso global a essa instância. É útil em situações em que você precisa de um objeto único em todo o sistema.

💡 Dica: Utilize o Singleton quando você precisar de uma única instância de uma classe que seja compartilhada por diferentes partes do sistema.

🚀 Exemplo de utilização do Singleton em JavaScript:

class Database {
  constructor() {
    if (Database.instance) {
      return Database.instance;
    }
    // Inicialização do objeto Database
    this.connection = 'Conexão estabelecida';
    Database.instance = this;
  }

  getConnection() {
    return this.connection;
  }
}

// Utilização do Singleton
const db1 = new Database();
const db2 = new Database();
console.log(db1 === db2); // true
console.log(db1.getConnection()); // 'Conexão estabelecida'
console.log(db2.getConnection()); // 'Conexão estabelecida'
Enter fullscreen mode Exit fullscreen mode

2. Observer (O Observador) 👀

O padrão Observer é como um serviço de notícias. Ele permite que um objeto (sujeito) notifique uma lista de objetos interessados (observadores) sobre quaisquer mudanças de estado. É útil quando você precisa que objetos reajam a eventos ou atualizações de outros objetos.

💡 Dica: Use o padrão Observer quando você tiver uma situação em que vários objetos precisam acompanhar e reagir a mudanças em um objeto principal.

🚀 Exemplo de utilização do Observer em JavaScript:

class Subject {
  constructor() {
    this.observers = [];
  }

  addObserver(observer) {
    this.observers.push(observer);
  }

  removeObserver(observer) {
    const index = this.observers.indexOf(observer);
    if (index !== -1) {
      this.observers.splice(index, 1);
    }
  }

  notifyObservers(data) {
    this.observers.forEach(observer => observer.update(data));
  }
}

class Observer {
  update(data) {
    console.log('Atualização recebida:', data);
  }
}

// Utilização do Observer
const subject = new Subject();
const observer1 = new Observer();
const observer2 = new Observer();

subject.addObserver(observer1);
subject.addObserver(observer2);

subject.notifyObservers('Nova atualização'); // Saída: "Atualização recebida: Nova atualização"
Enter fullscreen mode Exit fullscreen mode

3. Factory (A Fábrica) 🏭

O padrão Factory é como uma fábrica que produz objetos. Ele encapsula a criação de objetos em uma classe separada, permitindo que você crie objetos de diferentes tipos sem expor a lógica de criação no código cliente.

💡 Dica: Use o padrão Factory quando você precisar criar objetos de diferentes tipos, mas não souber exatamente qual objeto será necessário até o tempo de execução.

🚀 Exemplo de utilização do Factory em JavaScript:

class Animal {
  constructor(name) {
    this.name = name;
  }

  makeSound() {
    throw new Error('A implementação deve ser fornecida pela subclasse.');
  }
}

class Dog extends Animal {
  makeSound() {
    return 'Au Au!';
  }
}

class Cat extends Animal {
  makeSound() {
    return 'Miau!';
  }
}

class AnimalFactory {
  createAnimal(type, name) {
    if (type === 'dog') {
      return new Dog(name);
    } else if (type === 'cat') {
      return new Cat(name);
    }
    throw new Error('Tipo de animal desconhecido.');
  }
}

// Utilização do Factory
const animalFactory = new AnimalFactory();
const dog = animalFactory.createAnimal('dog', 'Max');
const cat = animalFactory.createAnimal('cat', 'Whiskers');

console.log(dog.makeSound()); // 'Au Au!'
console.log(cat.makeSound()); // 'Miau!'
Enter fullscreen mode Exit fullscreen mode

4. Strategy (A Estratégia) 🎯

O padrão Strategy é como escolher diferentes estratégias para atingir um objetivo. Ele permite que você defina uma família de algoritmos, encapsule cada um em uma classe separada e os torne intercambiáveis. É útil quando você tem várias maneiras de realizar uma tarefa e precisa escolher entre elas.

💡 Dica: Use o padrão Strategy quando você tiver diferentes algoritmos que podem ser aplicados em um contexto específico, permitindo a flexibilidade de trocar entre eles.

🚀 Exemplo de utilização do Strategy em JavaScript:

class StrategyContext {
  constructor(strategy) {
    this.strategy = strategy;
  }

  executeStrategy() {
    return this.strategy.execute();
  }
}

class Strategy {
  execute() {
    throw new Error('A implementação deve ser fornecida pela subclasse.');
  }
}

class ConcreteStrategyA extends Strategy {
  execute() {
    return 'Executando Estratégia A';
  }
}

class ConcreteStrategyB extends Strategy {
  execute() {
    return 'Executando Estratégia B';
  }
}

// Utilização do Strategy
const contextA = new StrategyContext(new ConcreteStrategyA());
console.log(contextA.executeStrategy()); // Saída: "Executando Estratégia A"

const contextB = new StrategyContext(new ConcreteStrategyB());
console.log(contextB.executeStrategy()); // Saída: "Executando Estratégia B"
Enter fullscreen mode Exit fullscreen mode

5. Decorator (O Decorador) 🎨

O padrão Decorator é como personalizar um objeto com adesivos divertidos. Ele permite adicionar novas funcionalidades a um objeto existente de forma dinâmica, sem modificar sua estrutura original. É útil quando você precisa adicionar comportamentos extras a objetos sem alterá-los permanentemente.

💡 Dica: Use o padrão Decorator quando você precisar adicionar funcionalidades extras a um objeto de forma flexível, permitindo combinações diferentes de comportamentos.

🚀 Exemplo de utilização do Decorator em JavaScript:

class Pizza {
  getDescription() {
    return 'Pizza';
  }

  cost() {
    return 10;
  }
}

class ToppingDecorator {
  constructor(pizza)

 {
    this.pizza = pizza;
  }

  getDescription() {
    return this.pizza.getDescription();
  }

  cost() {
    return this.pizza.cost();
  }
}

class Cheese extends ToppingDecorator {
  getDescription() {
    return `${this.pizza.getDescription()}, Queijo`;
  }

  cost() {
    return this.pizza.cost() + 2;
  }
}

class Tomato extends ToppingDecorator {
  getDescription() {
    return `${this.pizza.getDescription()}, Tomate`;
  }

  cost() {
    return this.pizza.cost() + 1;
  }
}

// Utilização do Decorator
const pizza = new Pizza();
const pizzaComQueijo = new Cheese(pizza);
const pizzaComQueijoETomate = new Tomato(pizzaComQueijo);

console.log(pizzaComQueijo.getDescription()); // 'Pizza, Queijo'
console.log(pizzaComQueijo.cost()); // 12

console.log(pizzaComQueijoETomate.getDescription()); // 'Pizza, Queijo, Tomate'
console.log(pizzaComQueijoETomate.cost()); // 13
Enter fullscreen mode Exit fullscreen mode

6. Proxy (O Procurador) 🕵️‍♂️

O padrão Proxy é como ter um representante que controla o acesso a um objeto. Ele age como um intermediário, permitindo adicionar comportamentos extras antes ou depois de acessar o objeto real. É útil quando você precisa controlar o acesso ou adicionar lógica adicional a um objeto existente.

💡 Dica: Use o padrão Proxy quando você precisar adicionar lógica de controle ou comportamentos extras antes ou depois de acessar um objeto, mantendo a mesma interface.

🚀 Exemplo de utilização do Proxy em JavaScript:

class RealSubject {
  request() {
    return 'RealSubject: Atendendo ao pedido.';
  }
}

class ProxySubject {
  constructor(realSubject) {
    this.realSubject = realSubject;
  }

  request() {
    if (this.checkAccess()) {
      return this.realSubject.request();
    }
    return 'ProxySubject: Acesso negado.';
  }

  checkAccess() {
    // Lógica para verificar acesso
    return true;
  }
}

// Utilização do Proxy
const realSubject = new RealSubject();
const proxy = new ProxySubject(realSubject);

console.log(proxy.request()); // Saída: "RealSubject: Atendendo ao pedido."
Enter fullscreen mode Exit fullscreen mode

Conclusão:

🎉 Parabéns, desenvolvedores! Agora vocês conhecem seis padrões de projeto poderosos e têm exemplos práticos para aplicar no seu código. Lembre-se de que cada padrão tem suas próprias situações adequadas, então escolha sabiamente quando aplicá-los. Continue explorando e aprimorando suas habilidades com esses padrões e torne seu código ainda mais incrível! 😄💻🏢

Top comments (0)