Jquery是个不错的JS框架,非常值得研究。
今天晚上花了一个来小时的时间研究了一下JQuery的插件机制。主要看了《jquery实战》,同时参考《javascript权威指南》
几点心得:
1.插件开发时,为什么是下面的代码结构:
这个结构实际上是一个匿名函数的声明之后加上了(),即表示声明匿名函数,同时执行它。
重要的是这个函数的参数,和执行时传进来的参数:两个要点,该函数的具名参数名称是$,这样在函数内部,可以用$来指代传进来的参数;另一方面,传进来的参数是jQuery,也就是说不管当前的环境中$代表的是什么,是jQuery还是Prototype,在我们的插件函数中$可以用来指代jQuery. 当然,如果你不想要这种方便,也可以直接使用jQuery.
2. 关于javascript的闭包.
感觉开发jQuery的插件,实际上就是在做一个闭包.
实际上闭包的产生是由于嵌套函数产生的,函数执行完成以后,该函数的调用结构可能还存在,仍然可以引用函数中的局部变量.
具体到jQuery的插件中,当将插件引入到页面中以后,就会执行在插件中定义的
上句中后段定义的是匿名函数是个嵌套函数,将其赋给了全局对象jQuery的属性,这样在插件函数执行完成以后,该函数的调用对象不会被销毁.该函数中定义的所有的局部变量都仍继续存在.但只能在该函数内部可以访问,其作用相当于私有变量.
3.使用散列对象封装函数的多个可选参数,使用$.extend({默认值},options||{});对参数进行处理.
4.两种扩展方法
今天晚上花了一个来小时的时间研究了一下JQuery的插件机制。主要看了《jquery实战》,同时参考《javascript权威指南》
几点心得:
1.插件开发时,为什么是下面的代码结构:
(function($){
//code goes here
})(jQuery);
这个结构实际上是一个匿名函数的声明之后加上了(),即表示声明匿名函数,同时执行它。
重要的是这个函数的参数,和执行时传进来的参数:两个要点,该函数的具名参数名称是$,这样在函数内部,可以用$来指代传进来的参数;另一方面,传进来的参数是jQuery,也就是说不管当前的环境中$代表的是什么,是jQuery还是Prototype,在我们的插件函数中$可以用来指代jQuery. 当然,如果你不想要这种方便,也可以直接使用jQuery.
2. 关于javascript的闭包.
感觉开发jQuery的插件,实际上就是在做一个闭包.
实际上闭包的产生是由于嵌套函数产生的,函数执行完成以后,该函数的调用结构可能还存在,仍然可以引用函数中的局部变量.
具体到jQuery的插件中,当将插件引入到页面中以后,就会执行在插件中定义的
(function($){/*code goes here*/})(jQuery)
结构,该结构中会有如下语句:jQuery.fn.pluginName = function(){};
上句中后段定义的是匿名函数是个嵌套函数,将其赋给了全局对象jQuery的属性,这样在插件函数执行完成以后,该函数的调用对象不会被销毁.该函数中定义的所有的局部变量都仍继续存在.但只能在该函数内部可以访问,其作用相当于私有变量.
3.使用散列对象封装函数的多个可选参数,使用$.extend({默认值},options||{});对参数进行处理.
4.两种扩展方法
$.extend(object)
$.fn.extend(object)
第一种方法是对jQuery类添加类属性,该方法可以直接通过$进行访问,例如$.object第二种方法是对jQuery.prototype进行扩展,相当于对jQuery的实例添加成员属性.该类方法的访问需要通过jQuery对象,不能通过$直接进行访问,需要先建立jQuery的对象.例如$('someId').object