Design patterns – Factory (Fábrica)

Antes de começarmos, segue algumas pergunta/respostas:

1. O que é padrão de projeto?
   R: http://pt.wikipedia.org/wiki/Padr%C3%A3o_de_projeto_de_software
2. O que é Factory pattern (fábrica)?
   1. Explicação sobre o padrão Factory:R: http://en.wikipedia.org/wiki/Factory_method_pattern
      R: http://en.wikipedia.org/wiki/State_pattern
   2. Qual sua categoria?R: Criacional
   3. Sua estrutura padrão:

Bom, explicações dadas, agora vamos começar a brincar com nossopadrão. O exemplo usado foi de uma fábrica celular.

Com base na estrutura básica do padrão fábrica, criei as seguintes classes:

//Produto
    abstract class Celular
    {
protected string numero;
public Celular(string numero) { this.numero = numero; }
public abstract void Ligar(string numero);
   }

//Produto concreto.

class IPhone : Celular
{
public Hashtable Agenda = new Hashtable();
public IPhone(string numero) : base(numero) { }
public override void Ligar(string numero)
{
Console.WriteLine(“({0} ligando para {1}.”,this.numero,numero);
Agenda[numero] = ( Agenda[numero] == null)? 0 : Convert.ToInt32( Agenda[numero])+1;
}
}
class Nokia : Celular
{
public Nokia(string numero) : base(numero) { }
   public override void Ligar(string numero)
{
Console.WriteLine(“({0} ligando >>> {1}…”, this.numero, numero);
}
}

//Criador

abstract class Factory
{
private Celular celular;
public abstract void Criar( string numero);
public Celular Celular
{
get {   return celular;  }
set  { celular = value;  }
}
}

//Fábrica

class IPhoneFactory : Factory
{
public override void Criar(string numero)
{
this.Celular = new IPhone(numero);
}
}
class NokiaFactory : Factory
{
public override void Criar( string numero)
{
this.Celular = new Nokia(numero);
}
}

O Diagrama dessa implementação ficará assim:


Sua chamada ficará assim:

Criando um jogo da forca em 80 linhas com javascript puro [ nada de framework! ;-) ]

Esse artigo é básicamente para mostrar como é fácil desenvolver coisas legais em javascript, em apenas algumas linhas de código, sem depender de frameworks, basta colocar a caixóla para funcionar.

Então vamos ao código, simples e fácil!

Diagrama de nossa ‘classe’:

function Forca(params){

var root = this,elemento = params.Elemento || document.body;
this.Palavras = params.Palavras || []; // vetor de palavras
this.Palavra = “”;  // palavra corrente
this.Erros = 0; // número de errros
this.Boneco = “”; // desenho do boneco

this.Teclado = function(){ // metodo responsável por montar o teclado.
var teclado = document.getElementById(“forca_teclado”);
if(!teclado){
teclado = document.createElement(“div”);
teclado.setAttribute(“id”,”forca_teclado”);
teclado.setAttribute(“class”,”teclado”);
for(var i = 65; i < 91; i++){
var tecla = document.createElement(“div”);
tecla.setAttribute(“class”,”tecla”);
tecla.innerHTML = String.fromCharCode(i);
tecla.setAttribute(“title”,String.fromCharCode(i));
if(tecla.addEventListener )
tecla.addEventListener(‘click’,function(){ root.Validar(this); },false);
else
tecla.attachEvent(‘onclick’,function(e){ root.Validar(event.srcElement);  });
teclado.appendChild(tecla);
}
elemento.appendChild(teclado);
}
}
this.Sorteio = function(){ //Método responsável pelo sorteio de uma nova palavra.
var novoIndice = Math.ceil(Math.random()*params.Palavras.length-1)
root.Palavra = params.Palavras[novoIndice];
var painel = document.getElementById(“forca_painel”);
if(!painel){
painel = document.createElement(“div”);
painel.setAttribute(“id”,”forca_painel”);
painel.setAttribute(“class”,”painel”);
elemento.appendChild(painel)
}
painel.innerHTML = “”;
for(var i = 0; i < root.Palavra.length;i++){
var letra = document.createElement(“div”);
letra.setAttribute(“id”,root.Palavra.substr(i,1));
letra.setAttribute(“class”,”letra”);
letra.innerHTML = “”;//root.Palavra.substr(i,1);
painel.appendChild(letra);
}
}
this.Validar = function(letra){   // Método responsável por validar e desenhar o boneco.
var desenho = document.getElementById(“forca_desenho”);
if(!desenho){
desenho = document.createElement(“div”);
desenho.setAttribute(“id”,”forca_desenho”);
elemento.appendChild(desenho);
}
var boneco;
if(root.Palavra.indexOf(letra.title) == -1){
this.Erros++;
switch(this.Erros){
case 1: root.Boneco += “\n   o”; break;
case 2: root.Boneco += “\n  \/”; break;
case 3: root.Boneco += “|”; break;
case 4: root.Boneco += “\\”; break;
case 5: root.Boneco += “\n  /”; break;
case 6: root.Boneco += ” \\\n <button onclick=’window.location.reload(true);’ style=’padding:0px;width:85px;border:1px solid black;’>GAME OVER</button>”; break;
}
desenho.innerHTML = ” <pre> “+root.Boneco+” </pre> “;
}
else
{
var indices = [];
for(var i = 0; i < root.Palavra.length;i++)
if(root.Palavra.substr(i,1) == letra.title) indices.push(i);
painel = document.getElementById(“forca_painel”).getElementsByTagName(“div”);
for(var i = 0; i < indices.length; i++)
painel[indices[i]].innerHTML =  letra.title;
}
}
this.Comecar = function(){ // Método responsável por iniciar tudo, criado só para deixar a chamada mais organizada! 
root.Teclado();
root.Sorteio();
}
}

A chamada do jogo ficará assim:

var parametros = { Elemento:/*algum elemento (div,e etc…)*/, Palavras:[/* um vetor de palavras, exemplo: "BRASIL","PADRE" */] }

var forca = new Forca(parametros);
forca.Comecar();

literalmente simples assim…

Para ver o jogo funcionando, acesse : http://migre.me/5ld1V