Upload
alex-casquete
View
1.015
Download
0
Embed Size (px)
DESCRIPTION
Presentación utilizada para una de las MicroCharlas del grupo de usuarios CatDotNet
Citation preview
JavaScript no es Vietnam Patrones y pruebas
Alex Casquete
1
ESTE SOY YO
Alex Casquete twitter: acasquete
blog: www.idlebit.es
Hablemos de JavaScript…
JavaScript es…
JavaScript is in the air
JavaScript no es como cualquier
otro lenguaje orientado a objetos
No vale con tirar líneas de código sin más
Tiene importantes diferencias con otros lenguajes
var myBeer = { “name” : “Moritz”, “take” : function() { alert(“Great!”); }, “displayName” : function() { alert(this.name + “ is my Beer”); }, “drink” : function() { // not implemented } }; myBeer.displayName(); myBeer.drink();
PATRONES DE CREACIÓN DE OBJETOS
NAMESPACE - DECLARING DEPENDENCIES - PRIVATE PROPERTIES AND
METHODS – REVELATION PATTERN - MODULE PATTERN - SANDBOX -
STATIC MEMBERS - OBJECT CONSTANTS - CHAINING PATTERN
PATRONES DE REUTILIZACIÓN DE CÓDIGO
PROTOTYPAL INHERITANCE - INHERITANCE BY COPYING PROPERTIES –
MIX-INS - BORROWING METHODS
PATRONES DE DISEÑO
BUILDER – FACTORY – SINGLETON – DECORATOR – FAÇADE – PROXY –
CHAIN OF RESPOSIBILITY – COMMAND - ITERATOR – MEDIATOR –
OBSERVER - STRATEGY
Patrón Module
9
var basketModule = (function() {
var basket = []; //private
return { //exposed to public
addItem: function(values) {
basket.push(values);
},
getItemCount: function() {
return basket.length;
},
getTotal: function(){
var q = this.getItemCount(),p=0;
while(q--){
p+= basket[q].price;
}
return p;
}
}
}());
Patrón Mediator
10
Módulo 1
Módulo 2
Módulo 3
Mediator doSomething
done!
Patrón Mediator
11
var mediator = (function(){ var subscribe = function(channel, fn){ if (!mediator.channels[channel]) mediator.channels[channel] = []; mediator.channels[channel].push({ context: this, callback: fn }); return this; }, publish = function(channel){ if (!mediator.channels[channel]) return false; var args = Array.prototype.slice.call(arguments, 1); for (var i = 0, l = mediator.channels[channel].length; i < l; i++) { var subscription = mediator.channels[channel][i]; subscription.callback.apply(subscription.context, args); } return this; }; return { channels: {}, publish: publish, subscribe: subscribe, installTo: function(obj){ obj.subscribe = subscribe; obj.publish = publish; } }; }());
Patrón Façade
12
var module = (function() { var _private = { i:5, get : function() { console.log('current value:' + this.i); }, set : function( val ) { this.i = val; }, run : function() { console.log('running'); }, jump: function(){ console.log('jumping'); } }; return { facade : function( args ) { _private.set(args.val); _private.get(); if ( args.run ) { _private.run(); } } } }());
module.facade({run: true, val:10}); //devuelve ‘current value: 10, running’
Patterns For Large-Scale JavaScript
Application Architecture
http://addyosmani.com/largescalejavascript/
Decouple app. architecture w/module,facade &
mediator patterns. Mods publish msgs, mediator
acts as pub/sub mgr & facade handles security
Pruebas
Las pruebas unitarias no son para JavaScript
SI NO PRUEBAS TU CÓDIGO VAS A
CONOCER EL DOLOR
JavaScript es díficil de probar
Si no tenemos nuestro código preparado
Código mezclado con HTML
Eventos en línea en el HTML
Frameworks Testing JavaScript
Un poco de código
Utiliza patrones
No reinventes la rueda
Prueba tu código
20
MicroCharlas CatDotNet 26 de julio 2012