Question

我有一个基于jQuery的JS插件的以下模式：

var myplugin = ( function ( $ )
{

    // (...)

    var myfunction = function()
    {
        console.log( "Calling default myfunction" );
    }

    // (...)

    return this;

})( jQuery );

我想让第三方覆盖插件中的功能（不一定是任何和所有），如下所示：

myplugin.myfunction = function()
{
    console.log( "Calling overridden myfunction" );
}

这可以在没有在全局范围内定义任何其他内容的情况下完成吗？

我意识到使用这种设计模式我想做的事情可能不太可行。如果是这种情况，我应该寻找什么类型的模式？

非常感谢！

Answer 1

你可以这样做

 var myplugin = ( function ( $ )
{

    // (...)

    this.myfunction = function()
    {
        console.log( "Calling default myfunction" );
    }


    // (...)

    return this;

})( jQuery );


myplugin.myfunction = function()
{
    console.log( "Calling overridden myfunction" );
}
myplugin.myfunction();

DEMO

Answer 2

就良好做法而言，您不应该鼓励修改您的插件。相反，您可以允许插件的修改后的副本。

var myPlugin = (function createModule($){
  var module = {};

  module.extend(stuff, function(changes){
    $.extend(createModule(), changes || {});
  });

  module.something = function(){
     return 1;
  }
  return module;
})(jQuery);

现在，如果我们致电myPlugin.something()，我们会获得1。

如果用户这样做：

var altPlugin = myPlugin.extend({
   something: function(){
      return 2;
   }
});

altPlugin.something() // => 2
myPlugin.something() // => 1

这允许我们非破坏性地修改行为或myPlugin。如果用户决定只想覆盖myPlugin仍然可以使用的内容，那么这只会提供更好的选择。

Answer 3

是的，但不是你想要的。您可以使用||运算符，然后使用一些options来传递。

(function ($) {
    $.fn.myplugin = function (options) {
        // (...)
        var myfunction = options.overRide || function () {
            console.log("Calling default myfunction");
        }
        // (...)
        return this;
    }
})(jQuery);

现在，你可以传递任何函数，如：

$('selector').myplugin({
    overRide: function () {
        console.log("Calling overridden function ");
    }
});

Javascript模块 - 覆盖函数

3 个答案:

DEMO