Come scrivere le funzioni concatenabili jquery per uso locale?

Question

Come scrivere funzioni concatenabili ma non inquinare $ .fn? Scrivi funzioni solo per l'utilizzo all'interno del mio plugin. È possibile?

$('.myclass').makeSomething().andOneMoreFunction().andLast(); 

È l'approccio corretto?

UPD. La soluzione migliore nel mio caso è metodo di estensione:

String.prototype.getMyLength = function(){return this.length;} 

e ora posso applicare questa funzione a qualsiasi stringa come questa:

var mystring = "test"; 
mystring.getMyLength(); 

O

"teststring".getMyLength() 

e renderlo chainable :

String.prototype.getMe = function(){return this;} 
"string".getMe().getMe().getMe().getMe().getMe(); 

Grazie per le risposte!

Answer 1

È possibile concatenare tutto ciò che si desidera. Se definisci uno $.fn da solo, è importante che tu sia return this alla fine della tua funzione.

Se vuoi scrivere un po 'di javascript da solo puoi anche fare una catena! Dipende solo da cosa ritorni. Quindi se restituisci qualche altro oggetto, puoi incatenarlo da quell'oggetto. Il valore di ritorno è usato per questo.

Esempio

var obj = { 
    test : function(){ 
     alert("Y"); 
     return this; 
    }, 
    test2 : function(){ 
     alert("2"); 
     return this; 
    } 
} 
obj.test().test2(); // And so on since it returns this 

jQuery Plugin API

$.fn.test = function(){ 
    var methods = { 
     method0 : function(){ 
      alert("method0"); 
      return this; 
     } 
    }; 
    return methods; 
} 
var api = $("obj").test(); // Returns methods 
api.method0(); // Calling a function from the returned methods. 
// OR 
$("obj").test().method0(); 

Sopra funzione non è jQuery chainable più. Quindi non puoi usare lo $("obj").test().addClass("test") perché restituisci la tua API!

Answer 2

Quando si chiama a.foo(), la funzione foo viene richiamata con this impostato su a. Puoi usare questo a tuo vantaggio.

ricordare inoltre che il espressionea.foo() restituisce tutto ciò che return d all'interno della funzione.

Quindi, è sufficiente restituire this.

Poi a.foo() viene valutata di nuovo a a, e (a.foo()).bar() diventa equivalente a chiamare a.foo() quindi chiamando a.bar() ... vale a dire operazioni concatenate su a!

$.fn non è particolarmente magico — utilizza semplicemente la logica di cui sopra nello stesso modo in cui si sta per.

Answer 3

È possibile evitare l'inquinamento utilizzando il primo parametro della funzione del proprio plugin per specificare il metodo di scelta; per esempio

(function() { 
    var o = { // object holding your methods 
     'bar': function() {console.log('bar', this); return this;}, 
     'foobar': function() {console.log('foobar', this); return this;} 
    }; 
    $.fn.foo = function (method /*, args*/) { 
     return o[method].apply(
      this, 
      Array.prototype.slice.call(arguments, 1) // pass your args 
     ); 
    }; 
}()); 

e poi

$('something').foo('bar').foo('foobar'); 
/* 
bar, thisobj 
foobar, thisobj 
*/ 

In questo modo si mantiene l'accesso all'oggetto jQuery come di consueto, anche.