El patrón del puente separa la parte abstracta de la parte de implementación, para que ambos puedan cambiarse de forma independiente y pueden funcionar armoniosamente juntos. Tanto la parte abstracta como la parte de implementación se pueden cambiar de forma independiente sin afectarse entre sí, reduciendo el acoplamiento del código y mejorando la escalabilidad del código.
Según la definición de GOF, el papel del modo puente es "aislar la abstracción de su implementación para que los dos puedan cambiar de forma independiente". Este patrón es de gran beneficio para la programación basada en eventos Común en JavaScript.
Una de las aplicaciones más comunes y prácticas del modo Bridge es la función de devolución de llamada del oyente de eventos. Ejemplo: el oyente de eventos, encapsula las declaraciones procesadas por eventos en las funciones de devolución de llamada y las programa a través de interfaces en lugar de implementaciones.
Teoría básica
Definición del patrón del puente: partes abstractas separadas de sus partes de implementación para que todas puedan cambiarse de forma independiente.
El modo puente consta principalmente de 4 roles:
(1) clase abstracta
(2) expandir las clases abstractas
(3) Implementar la interfaz de clase
(4) clase de implementación específica
Según las características del lenguaje JavaScript, lo simplificamos en 2 roles:
(1) expandir las clases abstractas
(2) clase de implementación específica
¿Cómo entender el modo puente? Demos un ejemplo a continuación
Implementación del modo puente
La clave para comprender la idea de un patrón de puente es comprender su idea de separar partes abstractas y realizar partes. Demos ejemplos para ilustrar
El modo de puente más fácil
De hecho, la jQuery cada función que usamos con mayor frecuencia es un modo de puente típico. Lo simulamos de la siguiente manera:
var cada = función (arr, fn) {for (var i = 0; i <arr.length; i ++) {var val = arr [i]; if (fn.call (val, i, val, arr)) {return false; }}} var arr = [1, 2, 3, 4]; cada uno (arr, function (i, v) {arr [i] = v * 2;})En este ejemplo, recorremos la matriz ARR a través de cada función. Aunque este ejemplo es muy común, contiene un patrón de puente típico.
En este ejemplo, la parte abstracta es cada función, que es la clase abstracta ampliada mencionada anteriormente, y la parte de implementación es FN, es decir, la clase de implementación concreta. La parte abstracta y la parte de implementación se pueden cambiar de forma independiente. Aunque este ejemplo es simple, es una aplicación típica del modo puente.
Modo de puente en el desarrollo del complemento
Un escenario adecuado para el modo puente es el desarrollo de componentes. Para adaptarse a diferentes ocasiones, los componentes tendrán muchos cambios en las diferentes dimensiones. El modo del puente se puede aplicar aquí, separando su abstracción de la implementación, haciendo que el componente sea más extensible.
Supongamos que queremos desarrollar un complemento emergente, que tenga diferentes tipos de ventanas emergentes: recordatorios de mensajes ordinarios, recordatorios de errores y el método de visualización de cada recordatorio es diferente. Este es un escenario de cambio multidimensional típico. Primero definimos dos clases: ventana emergente de mensajes normales y ventana emergente de mensajes de error.
function messageDialog (animation) {this.animation = animation;} messageDialog.prototype.show = function () {this.animation.show ();} functionialog (animation) {this.animation = animation;} errordialog.prototype.show = function () {this.animation.show ();}Estas dos clases son las partes abstractas mencionadas anteriormente, es decir, las clases abstractas extendidas, que contienen una animación de miembro.
Las dos ventanas emergentes se muestran a través del método del programa, pero los efectos de animación son diferentes. Definimos dos clases de efectos de visualización de la siguiente manera:
función LineRanImation () {} LineRanimation.prototype.show = function () {console.log ("es Liner");} función EASEANIMATION () {} Easeanimation.prototype.show = function () {Console.log ("Es facilitante");}Estas dos clases son clases de implementación específicas, que logran efectos de visualización específicos. Entonces, ¿cómo lo llamamos?
var mension = new MessageDialog (new LinerAnimation ()); Message.show (); var error = new Errordialog (new EaseAnimation ()); error.show ();
Si queremos agregar un efecto de animación, podemos definir otra clase de efecto y pasarla.
Resumir
La clave para aprender el modelo de puente es comprender la separación entre la parte abstracta y la parte de implementación, para que los dos puedan cambiarse de forma independiente sin obsesionarse con la forma. El complemento JS tiene cambios flexibles y la variedad de escenarios aplicables es muy adecuado para usar este modelo para lograr. Lo más importante de usar un modo de puente es descubrir las diferentes dimensiones del cambio en el sistema.
(1) Ventajas del modo puente:
Aislar la abstracción de la implementación ayuda a administrar de forma independiente varios componentes del software.
(2) Desventajas del modo puente:
Cada elemento del puente se usa para agregar una llamada de función, que tiene algún impacto negativo en el rendimiento de la aplicación. Aumenta la complejidad del sistema. Si se usa una función de puente para conectar dos funciones, y una de las funciones no se llamará fuera de la función del puente, entonces la función del puente no es necesaria en este momento.
El modo puente "aísla la abstracción de la implementación para que los dos cambien de forma independiente". Puede promover la modularidad del código, conducir a una implementación más limpia y mejorar la flexibilidad abstracta. Se puede utilizar para conectar un conjunto de clases y funciones, y proporciona un medio para acceder a datos privados con funciones privilegiadas.