Unos meses atrás inicié este blog con un par de entradas sobre mixins en C#. La verdad es que después de jugar un poco con ellos no me acabó de convencer la idea, sobre todo porque las implementaciones que encontré me parecieron bastante antinaturales en un lenguaje estático como es C#.

Hace poco, mientras leía código en github (sí, ya sé que es una afición un poco extraña) encontré esta línea:

MicroEvent.mixin(Ticker);

Ahora que llevo un tiempo jugando con javascript, pensé que estaría bien ver cómo se implementaban los mixins en un lenguaje dinámico como javascript. La solución es extremadamente sencilla y se basa en modificar los prototipos de las clases.

En este caso concreto, la «mezcla» se resuelve con este código:

MicroEvent.mixin = function(destObject){
   var props = ['bind', 'unbind', 'trigger'];
   for(var i = 0; i < props.length; i ++){
       destObject.prototype[props[i]] = MicroEvent.prototype[props[i]];
   }
}

Lo único que está haciendo es copiar a las funciones bind, unbind y trigger del prototipo de MicroEvent al prototipo de objeto de destino. Lo bueno es que la forma de escribir los métodos que van a ser mezclados es completamente natural:

...
bind : function(event, fct){
    this._events = this._events || {};
    this._events[event] = this._events[event] || [];
    this._events[event].push(fct);
},
...

En ese ejemplo estamos añadiendo una nueva propiedad a la clase (_events) y usándola para almacenar los manejadores de cada evento.

El código completo lo podéis encontrar en github y pertenece a la excelente librería MicroEvent de Jerome Etienne.