¿Qué es un patrón de diseño?

El patrón de diseño es resumir algunos problemas comunes y dar un conjunto de soluciones generales a problemas específicos (el énfasis está en la idea de resolver problemas); en desarrollo, siempre que se encuentre con tales problemas, puede usar directamente estos diseños. El modelo resuelve problemas; se originó en el campo de la arquitectura y resumió algunos problemas y experiencias en el campo de la arquitectura para formar un conjunto de soluciones que se pueden utilizar para resolver la mayoría de los problemas en el campo de la arquitectura. Más tarde, el campo de la computadora tomó prestado desde el modo de diseño del campo de la arquitectura Se resumen y resumen los problemas que se encuentran con frecuencia en el campo de la informática, formando 23 patrones de diseño en el campo de la informática.

Patrón singleton tradicional

En términos populares, el modo singleton es equivalente a la ventana de inicio de sesión de algún software o sitios web. Haga clic en iniciar sesión, luego cancele y vuelva a hacer clic en iniciar sesión. La ventana de inicio de sesión que aparece sigue siendo la misma y la ventana no se volverá a crear.

Asegúrese de que una clase tenga solo una instancia y proporcione un punto de acceso global a ella.

Darse cuenta de la idea central de singleton

Una variable se utiliza para marcar si un objeto ha sido creado para una determinada clase. Si es así, la próxima vez que se obtenga una instancia de la clase, el objeto creado previamente se devolverá directamente.

Use el código js para implementar el modo singleton

var CreateDiv = function (text) {
    
     //构造函数，初始化一个对象(对象又称为实例)
    this.text = text;
    this.init();
};

CreateDiv.prototype.init = function () {
    
    
    var div = document.createElement('div'); 
    div.innerHTML = this.text; 
    document.body.appendChild(div);
};

var ProxySingletonCreateDiv = (function () {
    
      //实现单例的函数
    var instance;
    return function (text) {
    
    
        if (!instance) {
    
     //若instance实例不存在，则创建
            instance = new CreateDiv(html);
        }
        return instance;
    }
})();

var a = new ProxySingletonCreateDiv('sven1');
var b = new ProxySingletonCreateDiv('sven2');

alert(a === b); //true

Modo de fábrica

Popular, por ejemplo, es equivalente a las máquinas expendedoras de carreteras que vemos. Como consumidores, podemos obtener lo que queremos solo eligiendo productos y pagando. ¿Cómo reconocen las máquinas expendedoras las opciones y cómo funcionan? No hay necesidad de saberlo. Las oportunidades de venta esconden su principio y mecanismo de funcionamiento, y es equivalente a una fábrica.

El patrón de fábrica es un patrón de diseño que se utiliza para crear objetos. No exponemos la lógica de la creación de objetos, sino que encapsulamos la lógica en una función, entonces esta función puede convertirse en una fábrica.

El modelo de fábrica se puede dividir en diferentes niveles de abstracción:

Fábrica simple
Método de fábrica
Fábrica abstracta

Patrón de fábrica simple

Implementar un patrón de fábrica simple con código js

let  factory = function (role) {
    
    
    function User(obj) {
    
    
        this.name = obj.name;
        this.role = obj.role;
    }
    switch(role) {
    
    
        case 'superman':
          return new User({
    
     name: '平台用户', role: ['主页', '登录页'] })
          //break;
        case 'man':
          return new User({
    
     name: '游客', role: ['登录页']})
          //break;
        default:
          throw new Error('参数错误')
    }
  }
    
  let superman = factory('superman');
  let man = factory('man');

 factory就是一个简单的工厂,该工厂中有一个构造函数分别对应不同的权限。我们只需要传递相应的参数就可以获取一个实例对象了

Las ventajas de una fábrica simple:
Solo necesita pasar un parámetro legal, puede obtener el objeto deseado sin conocer los detalles específicos de creación.

Pero la función contiene todo el constructor del objeto y el código de lógica de juicio. Si necesitamos agregar un objeto cada vez, entonces debemos agregar un nuevo constructor. Cuando los objetos que debemos mantener no son los dos anteriores, sino 20 o más, entonces esta función se convertirá en una superfunción, lo que dificultará su mantenimiento.

Por lo tanto, el modelo de fábrica simple solo es adecuado para situaciones en las que el número de objetos es pequeño y la lógica es simple.

Método de fábrica

La intención original del patrón del método de fábrica es diferir la creación real de objetos a subclases, de modo que la clase principal se convierta en una clase abstracta. Pero es difícil implementar clases abstractas en js como esos lenguajes tradicionales orientados a objetos, por lo que solo necesitamos referirnos a sus ideas en js.

Podemos pensar en la función de fábrica como una clase de fábrica. En el modo simple, necesitamos modificar dos lugares para agregar un nuevo objeto. Después de agregar el patrón del método de fábrica, solo necesitamos modificar un lugar. Para la clase de fábrica del método de fábrica, solo realiza la instanciación. Solo necesitamos modificar su clase de prototipo.

Usamos el modo seguro para crear objetos de fábrica.

Implementar el método de fábrica con código js

let factory = function (role) {
    
    
    if(this instanceof factory) {
    
      //instanceof是一个运算符，用来判断一个对象是否是某个类的实例
        var s = new this[role]();
        return s;
    } else {
    
    
        return new factory(role);
    }
}

factory.prototype = {
    
    
    admin: function() {
    
    
        this.name = '平台用户';
        this.role = ['登录页', '主页']

    },
    common: function() {
    
    
        this.name = '游客';
        this.role = ['登录页']
    },
    test: function() {
    
    
        this.name = '测试';
        this.role =  ['登录页', '主页', '测试页'];
        this.test = '我还有一个测试属性哦'
    }
}

let admin = new factory('admin');
let common = new factory('common');
let test = new factory('test');

Patrón de fábrica abstracto

(1) El patrón de fábrica abstracto proporciona una forma de encapsular un grupo de fábricas individuales con el mismo tema sin especificar sus clases específicas. Es decir, la fábrica de la fábrica; una fábrica que agrupa a fábricas individuales pero relacionadas / subordinadas juntas, pero no especifica su categoría específica.

(2) Una fábrica abstracta crea objetos relacionados con un tema común. En la programación orientada a objetos, una fábrica es un objeto que crea otros objetos. Una fábrica abstracta ha abstraído un tema, que es compartido por objetos recién creados.

(3) Quizás se pregunte por qué la responsabilidad de construir el objeto se le da a otros en lugar de llamar al constructor directamente con la nueva palabra clave.
La razón es: el constructor tiene un control limitado sobre todo el proceso de creación y, a veces, es necesario ceder el control a una fábrica con conocimientos más amplios. Esto incluye escenarios que involucran almacenamiento en caché de objetos, uso compartido o reutilización de objetos, lógica compleja o mantenimiento de recuentos de objetos y tipos durante el proceso de creación, y objetos que interactúan con diferentes recursos o dispositivos. Si su aplicación requiere más control sobre el proceso de creación de objetos, considere usar el patrón de fábrica abstracto.

Función de patrón de fábrica abstracto

Cuando hay dependencias interrelacionadas e implican una lógica de creación no simple, se recomienda utilizar el patrón de fábrica abstracto. El patrón de fábrica abstracto generalmente se considera en las siguientes situaciones:

Un sistema debe ser independiente de la creación, composición y presentación de sus productos.
El sistema debe configurarse con una de varias series de productos
Una serie de objetos de producto relacionados solo se usan juntos, por lo que esta restricción debe aplicarse
Desea proporcionar bibliotecas de clases de productos y solo desea mostrar sus interfaces, no sus implementaciones.
Conceptualmente, la vida útil de la dependencia es más corta que la vida útil del consumidor.
Necesita un valor de tiempo de ejecución para construir dependencias específicas
Quiero decidir qué producto llamar de la serie en tiempo de ejecución.
Debe proporcionar uno o más parámetros que solo se conocen en tiempo de ejecución antes de que se puedan resolver las dependencias.
Cuando se necesita consistencia entre productos
Al agregar un nuevo producto o línea de productos al programa, no desea cambiar el código existente.

Use el código js para implementar un patrón de fábrica abstracto

//员工类
function Employee(name) {
    
    
    this.name = name;

    this.say = function() {
    
    
        log.add("我是员工：" + name);
    };
}
//员工工厂
function EmployeeFactory() {
    
    
    this.create = function(name) {
    
    
        return new Employee(name);
    };
}
//供应商类
function Vendor(name) {
    
    
    this.name = name;

    this.say = function() {
    
    
        log.add("我是供应商：" + name);
    };
}
//供应商工厂
function VendorFactory() {
    
    
    this.create = function(name) {
    
    
        return new Vendor(name);
    };
}

// 日志函数
var log = (function() {
    
    
    var log = "";

    return {
    
    
        add: function(msg) {
    
    
            log += msg + "\n";
        },
        show: function() {
    
    
            console.info("%c%s", "color: red; background: #b4b3b3; font-size: 20px", log);
            log = "";
        }
    }
})();

function run() {
    
    
    var persons = [];
    var employeeFactory = new EmployeeFactory();
    var vendorFactory = new VendorFactory();

    persons.push(employeeFactory.create("张三"));
    persons.push(employeeFactory.create("李四"));
    persons.push(vendorFactory.create("王麻子"));
    persons.push(vendorFactory.create("赵六"));

    for (var i = 0, len = persons.length; i < len; i++) {
    
    
        persons[i].say();
    }

    log.show();
}

Varios patrones de diseño comunes en la interfaz (incluido el código de implementación)

Patrones de diseño