jquery插件开发学习笔记（二）

写在前面

我认为，今天的这个插件在写法上已经比较符合jquery插件开发的“正统”流程。在各个方面都考虑得比较完善。习惯了这种思路之后，对于开发功能完备的插件是大有帮助的。
相比较与第一个插件来说，插件主体区和功能区分离是最大的特点。另外，进过两个小时的bug分析，得出了惨痛的参数传递的方法（目前觉得还太高深，不是吾辈理解之）。

---

包裹

(function($){
    //code goes here
})(jQuery)

插件的衣服

默认参数

var defaults={
    color:"red",
    name:"myName",
    //etc...
};

分情况对待。如果参数在整个插件内都有引用，就声明为全局的（对于插件本身而言是全局的，对于网页脚本来说，它只是某个函数内部的变量。所以，给插件穿衣服是为了防止污染环境）。

插件功能方法区

var methods={
    init:function(options){
        var settings=$.extend({},defaults,options);//防止污染默认参数
        return this.each(function(){
            //code
        });
    }
    method_1:function(){
        return this.each(function(){
            //code
        });
    }
    method_2:function(){
        return this.each(function(){
            //code
        });
    }

};

需要的方法依次写好。注意，如果需要传递参数，就把穿进来的参数和默认参数合并到新的变量中。合并过程中间，为了防止污染默认参数，合并到一个新的空对象（｛｝）中。

插件区

$.fn.myPlugin=function () {
                var method=arguments[0];
                if(methods[method]){
                    method=methods[method];
                    arguments = Array.prototype.slice.call(arguments, 1);//!!!重要！！！
                }else if(typeof method==="object"||!method){
                    method=methods.init;
                }else{
                    $.error("error!!!");
                    return this;
                }
                return method.apply(this,arguments);
            };

用户调用时可能会传递函数（如果传递了，肯定是第一个参数），所以把arguments[0]储存到method中。
以下分几类情况进行讨论：
1、 如果传递了函数，属于存在methods[method]，所以method即为methods[method]，赋给它即可；重要的事情说三遍！重要的事情说三遍！重要的事情说三遍！（arguments = Array.prototype.slice.call(arguments, 1);） 解释：我们的方法是作为参数传入的，把它从参数列表中删除，因为调用方法时并不需要它（大神解释，目前还理解不了。）
2、如果用户没有传递函数，只是传递了参数（或者什么都没有传递），那么method即为init函数（初始化），所有的设置都要按照开发者的意愿进行。
3、如果用户传递的参数或者函数格式有误，报错。

调用

$("a").myPlugin("init",{"color":"blue", "backgroundColor":"#baf"});
$("button").myPlugin("yellow");

总结

jquery插件的作用就是一段封装起来的函数，实现特定的功能，比较友好的插件应尽可能多地给用户暴露出来一些参数可供调整。