JavaScript decoratori HOWTO?

Question

Ho bisogno di decorare una funzione di terze parti che non posso modificare quindi ho bisogno di decorarla in qualsiasi modo. Ho scoperto che in Prototype c'è qualcosa da fare facilmente [1].

C'è qualche alternativa a quella in jQuery o in semplice JavaScript?

[1] http://api.prototypejs.org/language/Function/prototype/wrap/

Answer 1

E il tuo scenario richiede una libreria? Sembra che con javascript nativo, si potrebbe semplicemente:

• Salva una copia della funzione originale
• Creare una versione modificata della funzione che utilizza l'originale
• memorizzare un riferimento alla versione modificata in cui il l'originale è stato originariamente memorizzato.

Answer 2

Mi piacciono le funzioni di wrap fornite dalle librerie: Prototype ha la funzione di wrap. In ExtJS, si potrebbe usare createDelegate o createInterceptor. Dojo ha AOP dichiarativo. Sans framework, si potrebbe fare questo:

myFunction(){ 
    something(); 
    thirdParty.call(); // or apply 
    perhapsSomethingElse(); 
} 

Answer 3

Con jquery, sarebbe piuttosto semplice aggiungere semplicemente un'altra funzione da utilizzare. Provare qualcosa di simile:

//Sample function you're wrapping around 
function say_hi(){ 
    alert('hi'); 
} 

//quick jq plugin 
jQuery.fn.functionWrap = function(arg,opts){ 
    if(opts.before && typeof(opts.before)=='function'){ 
     opts.before(); 
    } 
    arg(); 
    if(opts.after && typeof(opts.after)=='function'){ 
     opts.after(); 
    } 
}; 


//sample function to use the wrapper func 
function btnPress(){ 
    $().functionWrap(
     say_hi, 
     { 
      before : function(){ alert('happens before'); }, 
      after : function(){ alert('happens after'); } 
     } 
    ); 
} 

Prova ad aggiungere che alla tua pagina, e qualcosa di simile per verificare il lavoro svolto:

<input type="button" value="asdf" onClick="btnPress();" /> 

Spero che questo ti aiuta.

Answer 4

andrò per Frank Schwieterman soluzione:

new_func = originalFunc 
function myExtendedVersion() 
{ 
    // do my stuff 
    new_func(); 
    // do my stuff 
} 

Answer 5

Si potrebbe fare con il plugin jQuery AOP: http://code.google.com/p/jquery-aop/

codice sarà simile:

jQuery.aop.around({target: window, method: 'originalFunc'}, 
    function(invocation) { 
    // do your stuff 
    invocation.proceed(); 
    // do your stuff 
    } 
);