Javascript 学习和扩展jquery插件

我正在学习更多关于javascript插件的知识，并找到了一个我感兴趣的插件。我愿意把我的脚弄脏，看看这东西怎么能被修改

(function( $ ){
  var methods = {
    init : function( options ) { 

     return this.each(function(){ 
     var $this = $(this),
         data = $this.data('tooltip'),
         tooltip = $('<div />', {
           text : $this.attr('title')
         });

     // If the plugin hasn't been initialized yet
     if ( ! data ) {

     console.log('still working..'  );
       /*
         Do more setup stuff here
       */

       $(this).data('tooltip', {
           target : $this,
           tooltip : tooltip
       });

     }
   });

},
show : function( ) {
  console.log('this is the show');
},
hide : function( ) { 
  // GOOD
},
update : function( content ) {
  console.log('this is the update');    
  // !!! 
    }
  };

  $.fn.tooltip = function( method ) {

// Method calling logic
if ( methods[method] ) {
  return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || ! method ) {
  return methods.init.apply( this, arguments );
} else {
  $.error( 'Method ' +  method + ' does not exist on jQuery.tooltip' );
}    

  };
   })( jQuery );

我知道它会返回所有的方法，但是

3a。为什么write methods[method]//is看起来像是一个数组，这让我很困惑，因为我没有看到数组，它是一堆方法

3b。还有什么要检查的？或者为什么会发生错误

---

谢谢你的建议，帮助我完全理解这个插件

我不知道你的第一个问题是什么意思。但其他问题可以很容易地解决

首先，让我们复习3

您拥有的代码，以及jQuery在其文档中提供的内容，只是您和您的方法之间的一种“getter”。您将方法放入对象标题

methods

（在第一个代码块的第二行实例化）中，而不是使用所有方法聚集名称空间

---

如果您查看jQuery提供的代码，它不会像您所想的那样返回方法。它调用

methods

对象中键的方法。第一条If语句说如果您调用插件（在您的例子中，工具提示）使用字符串变量，它将在methods对象中查找该索引并调用该函数

第二个elseif块表示，如果您将对象作为参数传递或不作为参数传递，它将调用您的init方法。这有点像为插件定制的getter/initializer

现在，为了回答第二个问题，可以通过调用工具提示插件来访问init方法

1） 无参数

2） 对象参数（通常是选项，如

{“someOption”：true，“anotherOption”：400}

）

3） 字符串“init”如

$（'#id'）。工具提示（'init'）

通过这种方式，您还可以使用

$（'#id）.工具提示（'hide'）

。。。等等

---

您可以在jQuery文档中了解更多细节。这只是我用外行的话来说的。

你调查过吗？我最近一直在研究这个问题，并开始创建一些。这看起来很酷，但我不想要一个插件-我已经发出了太多的http请求，我真的很想在一个js页面上做一些事情，与第三方扩展几乎没有关系。。。不过还是要谢谢你。”第一条if语句说，如果你用一个字符串变量调用你的插件（在你的例子中是tooltip），它会在methods对象中查找索引并调用函数。“在我的例子中，索引是什么，methods对象和函数是什么。。。？感谢第一个代码块中的第二行是变量

methods

。该变量恰好是一个用方法填充的对象。这就是你的方法对象，对吧？是的，它是所有内部函数的父变量对象，比如init:，hide:，和update.parent-var对象，不……你应该研究更多的jQuery文档和javascript语法<代码>var方法是一个对象变量。对象中每个项的键是方法名（init，show，…），对象中每个项的值是实际的方法。我想你需要更深入地阅读javascript语法。您应该研究javascript中的对象及其工作方式。

 if ( methods[method] ) {
  return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || ! method ) {
  return methods.init.apply( this, arguments );
} else {
  $.error( 'Method ' +  method + ' does not exist on jQuery.tooltip' );
}