Reemplazando una función en el complemento jQuery

Question

Tengo un complemento jQuery existente, ahora quiero extenderlo. Considere el complemento mencionado a continuación:

$.fn.x = function(option) { 
     var def = { 
      a: 1, 
      b: 2 
     }; 

     option = $.extend(def, option); 
     function abc() { 
      //do something 
     } 
     function def() { 
      //do something 
     } 
    }; 

Ahora, el anterior es el complemento que obtuve de algún lado. Necesito tener un comportamiento personalizado para el método ABC, por ejemplo

function abc() { 
       //do something else 
      } 

No quiero cambiar el plugin existente, ¿Me puede decir cómo podría conseguir el mismo mediante la extensión de la misma o haciendo mi propio complemento personalizado ?

EDIT: he intentado esto también con el método mencionado a continuación:

 (function($) { 
     $.fn.x = function(option) { 
      var defaults = { 
       a: 1, 
       b: 2 
      }; 

      option = $.extend(def, option); 
      function abc() { 
       //do something 
       console.log('Base method called'); 
      } 
      function def() { 
       //do something 
       abc(); 
      } 
      def(); 
     }; 
    })(jQuery); 

    (function() { 
     var x = $.fn.x; 
     $.fn.x.abc = function() { 
      console.log('Overidden method called'); 
      //_x.abc(); 
     }; 
    })(); 


    $('<div/>').x(); 

Pero todavía estoy recibiendo "Base método llamado" como la salida de la consola.

Answer 1

La mejor ruta puede variar, pero algo que he hecho en el pasado es ¡envolver la extensión por mi cuenta! Esto funciona mejor cuando intentas operar algo que el complemento hace sin modificar su código subyacente.

(function($){ 
    $.fn.extendedPlugin = function(options) { 

     var defaults = { 
      //... 
     }; 
     var options = $.extend(defaults, options); 

     //Here you can create your extended functions, just like a base plugin. 

     return this.each(function() { 
      //Execute your normal plugin 
      $(this).basePlugin(options); 

      //Here you can put your additional logic, define additional events, etc 
      $(this).find('#something').click(function() { 
       //... 
      }); 
     }); 
    }; 
})(jQuery); 

Sé que esto no es muy específica (es difícil sin un escenario específico), pero es de esperar que va a ayudarle a empezar por el camino correcto!

Answer 2

Esto es lo más lejos que tengo. Pero cuando descomiento _x.abc.apply(this, arguments);, se queda atascado en un bucle recursivo.

Aquí está la jsFiddle si alguien quiere jugar con y solucionarlo: http://jsfiddle.net/TLAx8/

// PLUGIN DEFINITION 

(function($){ 
    $.fn.x = function(option) { 
     var def = { 
      a: 1, 
      b: 2 
     }; 

     option = $.extend(def, option); 
     function abc() { 
      console.log('Plugin method called'); 
     } 
     function def() { 
      //do something 
     } 
    }; 
})(jQuery); 


// OVERRIDING THE PLUGIN METHOD 

(function(){ 
    var _x = $.fn.x; 
    $.fn.x.abc = function() { 
     console.log('Overidden method called'); 
     //_x.abc.apply(this, arguments); 
    } 
})(); 


// INVOKING THE METHOD 

(function() { 
    $.fn.x.abc(); 
});