`
deepthink
  • 浏览: 55061 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类

关于jquery widget插件模式的几点思考

阅读更多

widget是jqueryui 提供的内置插件模式,前面我曾经写过一篇文章 对jQuery做的修改 其中:

 

写道
抛弃了widget的扩展模式,抛弃了 tabs.tabs("swidth","12121") 这种调用模式,使用 obj.method(args) 的调用模式

 

  这里有必要对原因作以下说明,为什么我会抛弃widget的扩展模式

 

widget 可能在设计之初的时候,jquery的开发者可能一直想把所有的事件都设定为脚本绑定,而不是用javascript:obj.method();void(0); 这种模式,这也就出现了我们无法直接调用tabs的swidth的方法的现象,而必须通过tabs.tabs("swidth",args)  的条用方法,然而,这种调用方法还有一个弊端:无法返回数据,只能返回jquery对象本身,我不太清楚jquery为什么会这么做,是因为要和juqery的 fn 插件模式保持一直,还是为了保持jquery是用的简易性、连贯性(可能性比较大),但是不管怎么说,这都导致了再是用jquery进行开发中,开发人员有意识或者无意识的在js代码中使用大量的绑定行为,这就会使我们的HTML代码可阅读性降低,因为我们会再开发的过程中,为了绑定而添加大量的selector认知符,比如id,class ,而这些可能是没有任何意义的(我是这样认为的),关键的问题在于:大家都知道在IE中,循环绑定事件是可能造成内存泄露的,而且有很多人曾经这么做或者现在还在做(包括我自己)。

 

 

虽然绑定行为并不是罪大恶极,而且如果可能,我们要推荐这种方法;

但是事实是残酷的,目前为止对于大部分的项目而言,这种做法是不利的,带来的负面效果远远大于所给我们带来的优势,我们不能纯粹为了追究技术的极致而忽略了实际需要...

 

所以,就有了 对jQuery做的修改 一文,目的在于简化jquery的扩展模式,在保持是用jquery优势的情况下,规避一些不必要的风险

 

下面是base.js 包

 

;
(function($){
		
	/* 对闭包的扩展,是用方式为 function(arg1){...}.bind(obj,arg1);可参考prototype.js中的bind */
	Function.prototype.bind = Function.prototype.bd = function(){
		var method = this ;
		var obj = arguments[0];
		
		var args = arguments;
		
		return function(){
			var newArgs = [];
			var i ,len = args.length ;
			if(len > 1){
				for(i = 1; i < len ; i ++){
					newArgs.push(args[i]);
				}
			}
			
			len = arguments.length ;
			for(i = 0 ; i < len ; i ++){
				newArgs.push(arguments[i]);
			}
			
			method.apply(obj,newArgs);
		}
	};
	
              /* 对象创建方式,使用constructor init */
	window["class"] = window.clazz = {
		create:function(){
			function klass(){
		      this.init.apply(this, arguments);
		    }
			
		    if (!klass.prototype.init)
		      klass.prototype.init = function(){} ;
			
		    klass.prototype.constructor = klass ;
		    return klass ;
		}
	};
})(jQuery);
 

 希望这篇文章能给大家带来一些帮助...

分享到:
评论
1 楼 liusx2010 2010-12-03  

相关推荐

    jquery ui插件以及示例

    jquery ui插件库文件,包含jquery必需的库文件以及各个用法示例

    jquery插件库(jquery.treeview插件库)

    jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery....

    jQuery打印插件jqprint,内包含使用示例

    jQuery打印插件jqprint,jquery.jqprint-0.3.js 下载,内包含使用示例,下载解压可直接在浏览器打开使用。 jQuery打印插件jqprint,jquery.jqprint-0.3.js 下载,内包含使用示例,下载解压可直接在浏览器打开使用。 ...

    jQuery插件jQuery插件

    jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件

    jquery 插件jquery 插件jquery 插件jquery 插件

    jquery 插件jquery 插件jquery 插件jquery 插件

    jQuery常用插件大全pdf

    jQuery常用插件大全 jQuery 插件大全

    jquery插件库大全(200个).zip

    jquery插件库大全(200个): jqueryQQ表情插件 jquery下拉菜单导航 jquery下拉菜单栏 jquery仿Windows系统选中图标效果 jquery仿京东商品详情页图片放大效果 jquery仿百度新闻焦点轮播 jquery分离布局模版 jquery...

    jQuery插件,jQuery插件

    jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件

    几种实用的JQuery图表插件

    几种实用的JQuery图表插件 JQuery图表插件 Flot Highcharts jquerychart jqPlot包下载,以及中文帮助文档

    jqModal - jQuery模式窗口插件

    jqModal - jQuery模式窗口插件 。

    jquery 上传插件

    jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件...

    jquery图表插件大全收集

    jquery图表插件大全收集 jquery图表插件大全收集jquery图表插件大全收集jquery图表插件大全收集

    orgchart.js 组织架构图之JQuery插件

    组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件...

    jQuery grid view plugin - jQuery表格插件

    jQuery grid view plugin - jQuery表格插件

    jquery 日期插件

    jquery 日期插件jquery 日期插件jquery 日期插件jquery 日期插件

    jQuery widget设计文档

    NULL 博文链接:https://xinyangwjb.iteye.com/blog/1898002

    jQuery Timers - jQuery定时器插件

    jQuery Timers - jQuery定时器插件

    jquery上传插件upload

    jquery 上传 插件 upload jquery上传插件upload jquery 上传 插件 upload jquery上传插件upload jquery 上传 插件 upload jquery上传插件upload jquery 上传 插件 upload jquery上传插件upload jquery 上传 插件 ...

    Ddreamweaver的jquery插件

    Ddreamweaver jquery 插件 Ddreamweaver jquery 插件Ddreamweaver jquery 插件 Ddreamweaver jquery 插件 Ddreamweaver jquery 插件 Ddreamweaver jquery 插件 Ddreamweaver jquery 插件

    Wijmo Jquery Widget

    Wijmo Base on Jquery UI Widget

Global site tag (gtag.js) - Google Analytics