Categorías de patrones de diseño

Curso Profesional de JavaScript

Introducción

¿Qué significa ser un profesional de JavaScript?

Aspectos que destacan a un profesional

Inicio del proyecto

Repaso de Conceptos Fundamentales

Cómo llega un script al navegador

Scope

Closures

El primer plugin

this

Los métodos call, apply y bind

Prototype

Herencia Prototipal

Cómo funciona JavaScript

Parsers y el Abstract Syntax Tree

Abstract Syntax Tree en Práctica

Cómo funciona el JavaScript Engine

Event Loop

Fundamentos Intermedios

Promesas

Getters y setters

Fundamentos Avanzados

Proxy

Generators

APIs del DOM

Fetch - Cómo cancelar peticiones

IntersectionObserver

VisibilityChange

Service Workers

TypeScript

Introducción

Tipos básicos

Funciones

Interfaces

Clases

Convertir el proyecto a TypeScript

Patrones de Diseño

Qué es un patrón de diseño

Categorías de patrones de diseño

Patrón Singleton y Casos de Uso

Implementación del patrón Singleton

¿Cómo funciona el Patrón Observer?

Implementación del patrón Observer

Casos de Uso del patrón Observer: Redux

Patrón Decorator y Casos de Uso

Implementación del patrón Decorator

Proyecto: MediaPlayer

Implementación de plugin de Ads: Desplegando en consola

Implementación de plugin de Ads: Desplegando en pantalla

Publicar en npm

Conclusiones

Aún no tienes acceso a esta clase

Crea una cuenta y continúa viendo este curso

Crear cuenta

Si ya tienes una cuenta,

Iniciar sesión

Recursos

Creacionales. Proveen diferentes mecanismos para crear objetos.

Estructurales. Describen formas de componer objetos para formar nuevas estructuras flexibles y eficientes.

De Comportamiento. Gestionan algoritmos y responsabilidades entre objetos.

Aportes 47

Preguntas 2

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.

beaps

hace 3 años

Patrones de diseño

➡️Creacionales
Proveen diferentes mecanismos para crear objetos.

Abstract Factory
Builder
Factory Method
Prototype
Singleton

➡️Estructurales
Describen formas de componer objetos para formar nuevas estructuras flexibles y eficientes.
Adapter
Bridge
Composite
Decorator
Facade
Flyweight
Proxy

➡️Comportamiento
Gestionan algoritmos y responsabilidades entre objetos.
Chain of Responsibility
Command
Interpreter
Iterator
Mediator
Memento
Observer
State
Strategy
Template Method
Visitor

Cesar Augusto Barco de Gouveia

hace 3 años

Relación de principales patrones GoF (Gang Of Four)[editar]

Patrones creacionales[editar]

Corresponden a patrones de diseño de software que solucionan problemas de creación de instancias. Nos ayudan a encapsular y abstraer dicha creación:

Object Pool (no pertenece a los patrones especificados por GoF): se obtienen objetos nuevos a través de la clonación. Utilizado cuando el costo de crear una clase es mayor que el de clonarla. Especialmente con objetos muy complejos. Se especifica un tipo de objeto a crear y se utiliza una interfaz del prototipo para crear un nuevo objeto por clonación. El proceso de clonación se inicia instanciando un tipo de objeto de la clase que queremos clonar.
Abstract Factory (fábrica abstracta): permite trabajar con objetos de distintas familias de manera que las familias no se mezclen entre sí y haciendo transparente el tipo de familia concreta que se esté usando. El problema a solucionar por este patrón es el de crear diferentes familias de objetos, como por ejemplo, la creación de interfaces gráficas de distintos tipos (ventana, menú, botón, etc.).
Builder (constructor virtual): abstrae el proceso de creación de un objeto complejo, centralizando dicho proceso en un único punto.
Factory Method (método de fabricación): centraliza en una clase constructora la creación de objetos de un subtipo de un tipo determinado, ocultando al usuario la casuística, es decir, la diversidad de casos particulares que se pueden prever, para elegir el subtipo que crear. Parte del principio de que las subclases determinan la clase a implementar. A continuación se muestra un ejemplo de este patrón:

class ConcreteCreator extends Creator{
    protected Product factoryMethod(){
        return new ConcreteProduct();
    }
}

interface Product{...}

class ConcreteProduct implements Product{...}

public class Client{
    public static void main(String args[])
    {
        Creator unCreator = new ConcreteCreator();
        unCreator.factoryMethod();
    }
}

Prototype (prototipo): crea nuevos objetos clonándolos de una instancia ya existente.
Singleton (instancia única): garantiza la existencia de una única instancia para una clase y la creación de un mecanismo de acceso global a dicha instancia. Restringe la instanciación de una clase o valor de un tipo a un solo objeto. A continuación se muestra un ejemplo de este patrón:

		public sealed class Singleton
		{
		    private static volatile Singleton instance;
		    private static object syncRoot = new Object();
		    private Singleton()
		    {
		        System.Windows.Forms.MessageBox.Show("Nuevo Singleton");
		    }
		    public static Singleton GetInstance
		    {
		        get
		        {
		            if (instance == null)
		            {
		                lock(syncRoot)
		                {
		                    if (instance == null)
		                    instance = new Singleton();
		                }
		            }
		            return instance;
		        }
		    }
		}

Model View Controller (MVC) ♙En español: Modelo Vista Controlador. Es un patrón de arquitectura de software que separa los datos y la lógica de negocio de una aplicación de la interfaz de usuario y el módulo encargado de gestionar los eventos y las comunicaciones. Este patrón plantea la separación del problema en tres capas: la capa model, que representa la realidad; la capa controller , que conoce los métodos y atributos del modelo, recibe y realiza lo que el usuario quiere hacer; y la capa vista, que muestra un aspecto del modelo y es utilizada por la capa anterior para interactuar con el usuario.

Patrones estructurales[editar]

Son los patrones de diseño software que solucionan problemas de composición (agregación) de clases y objetos:

Adapter o Wrapper (Adaptador o Envoltorio): Adapta una interfaz para que pueda ser utilizada por una clase que de otro modo no podría utilizarla.
Bridge (Puente): Desacopla una abstracción de su implementación.
Composite (Objeto compuesto): Permite tratar objetos compuestos como si de uno simple se tratase.
Decorator (Decorador): Añade funcionalidad a una clase dinámicamente.
Facade (Fachada): Provee de una interfaz unificada simple para acceder a una interfaz o grupo de interfaces de un subsistema.
Flyweight (Peso ligero): Reduce la redundancia cuando gran cantidad de objetos poseen idéntica información.
Proxy: Proporciona un intermediario de un objeto para controlar su acceso.
Module: Agrupa varios elementos relacionados, como clases, singletons, y métodos, utilizados globalmente, en una entidad única.

Patrones de comportamiento[editar]

Se definen como patrones de diseño software que ofrecen soluciones respecto a la interacción y responsabilidades entre clases y objetos, así como los algoritmos que encapsulan:

Chain of Responsibility (Cadena de responsabilidad): Permite establecer la línea que deben llevar los mensajes para que los objetos realicen la tarea indicada.
Command (Orden): Encapsula una operación en un objeto, permitiendo ejecutar dicha operación sin necesidad de conocer el contenido de la misma.
Interpreter (Intérprete): Dado un lenguaje, define una gramática para dicho lenguaje, así como las herramientas necesarias para interpretarlo.
Iterator (Iterador): Permite realizar recorridos sobre objetos compuestos independientemente de la implementación de estos.
Mediator (Mediador): Define un objeto que coordine la comunicación entre objetos de distintas clases, pero que funcionan como un conjunto.
Memento (Recuerdo): Permite volver a estados anteriores del sistema.
Observer (Observador): Define una dependencia de uno-a-muchos entre objetos, de forma que cuando un objeto cambie de estado se notifique y actualicen automáticamente todos los objetos que dependen de él.
State (Estado): Permite que un objeto modifique su comportamiento cada vez que cambie su estado interno.
Strategy (Estrategia): Permite disponer de varios métodos para resolver un problema y elegir cuál utilizar en tiempo de ejecución.
Template Method (Método plantilla): Define en una operación el esqueleto de un algoritmo, delegando en las subclases algunos de sus pasos, esto permite que las subclases redefinan ciertos pasos de un algoritmo sin cambiar su estructura.
Visitor (Visitante): Permite definir nuevas operaciones sobre una jerarquía de clases sin modificar las clases sobre las que opera.

Patrones de interacción[editar]

El primer intento por aplicar este concepto en el diseño de las interfaces de usuario se dio por Ward Cummingham y Kent Beck quienes adaptaron la propuesta de C. Alexander y crearon cinco patrones de interfaz: Window per task, Few panes, Standard panes, Nouns and verbs, y Short Menu. En años más recientes investigadores como Martin Van Welie, Jennifer Tidwell han desarrollado colecciones de patrones de interacción para la World Wide Web. En dichas colecciones captan la experiencia de programadores y diseñadores expertos en el desarrollo de interfaces usables y condensan esta experiencia en una serie de guías o recomendaciones, que puedan ser usadas por los desarrolladores novatos con el propósito de que en poco tiempo adquieran la habilidad de diseñar interfaces que incidan en la satisfacción de los usuarios. Los patrones de interacción buscan la reutilización de interfaces eficaces y un manejo óptimo de los recursos de las páginas web, haciendo más eficaz el consumo de tiempo en el diseño del sitio web y permitiendo a los programadores novatos adquirir más experiencia.

Jaime Gabriel González Célleri

Si ya tienes una cuenta,

Curso Profesional de JavaScript

Categorías de patrones de diseño

Relación de principales patrones GoF (Gang Of Four)[editar]

Patrones creacionales[editar]

Patrones estructurales[editar]

Patrones de comportamiento[editar]

Patrones de interacción[editar]

Patrones de diseño

Patrones creacionales

Patrones estructurales

Patrones de comportamiento

Patrones Creacionales

Patrones Estructurales

Patrones de Comportamiento