Java程序员的JavaScript学习笔记(10—— jQuery-在“类”层面扩展)

计划按如下顺序完成这篇笔记:

1.    理念。

2.    属性复制和继承。

3.    this/call/apply。

4.    闭包/getter/setter。

5.    prototype。

6.    面向对象模拟。

7.    jQuery基本机制。

8.    jQuery选择器。

9.    jQuery工具方法。

10.    jQuery-在“类”层面扩展。

11.    jQuery-在“对象”层面扩展。

12.    jQuery-扩展选择器。

13.    jQuery UI。

14.    扩展jQuery UI。

这是笔记的第10篇,我们考虑如何从实用角度,从“类”的角度对家Query进行扩展。

jQuery是一个紧凑的框架,专注解决最核心的问题,没有追求大而全,所有扩展机制对jQuery来说,至关重要。

JavaScript以函数为基础,今天我们试图基于jQuery构建一个针对自己项目的函数库,每个函数实现特定的功能,同时对这些函数进行有效的组织。

作者博客:http://blog.csdn.net/stationxp

作者微博:http://weibo.com/liuhailong2008

转载请取得作者同意

1、目标

通过$调用我们的函数库。函数库按照功用分级组织。效果如下:

$.util.parseDate

$.util.parseDecimal

$.page.event.init

2、方法

上一篇我们了解到,通过jQuery.extend()可以方便地对jQuery进行扩展,甚至能覆盖extend本身。

jQuery.extend()支持以下几种函数签名:

jQuery.extend(obj);

jQuery.extend(isDeep,obj);

jQuery.extend(target,src1,src2,...);

jQuery.extend(isDeep,target,src1,src2,...);

我们可以extend源代码的基础上修改,并覆盖原来的extend,这样修改一个可能被广泛使用的函数,修改了其他人对输入参数的预期,是不合适的,可能会误导其他人,输入了错误的参数,带来错误隐患。

我们重新定义一个方法,如下:

jQuery.extend({
	ns_extend : function(){
		var ns, nss, target, i, src, length ;
		length = arguments.length;

		if(length>1){
			ns  = arguments[0];
			i = 1;
		} else {
			i = 0;
		}

		if(!( src = arguments[i] )  ||  !jQuery.isPlainObject( src ) ){
			return ;
		}

		target = this;

		if(ns){
			nss = ns.split('.'); // TODO 这里需要做好多字符过滤处理
			for( var idx = 0; idx < nss.length ; ++idx	){
				ns =  nss[idx];// ns 的语义改变了,原来的语义使命结束,这里用作临时变量
				ns = jQuery.trim(ns);
				if(ns){
					target[ns] = target[ns] || {};
					target = target[ns];
				}
			}
		}

		for( ; i < length ;  ++i ){
			src = arguments[i];
			jQuery.extend( target, src );
		}

	}
});

jQuery.ns_extend('pet',{
	miao : function(){
		alert('i am a cat');
	}
});

jQuery.ns_extend('my.fav.pet',{
	wangwang : function(){
		alert('i am a dog');
	}
});

$.pet.miao();

$.my.fav.pet.wangwang();

目的达成!

时间: 2024-08-24 08:14:01

Java程序员的JavaScript学习笔记(10—— jQuery-在“类”层面扩展)的相关文章

Java程序员的JavaScript学习笔记(11——jQuery-在“对象”层面扩展)

计划按如下顺序完成这篇笔记: 1.    理念. 2.    属性复制和继承. 3.    this/call/apply. 4.    闭包/getter/setter. 5.    prototype. 6.    面向对象模拟. 7.    jQuery基本机制. 8.    jQuery选择器. 9.    jQuery工具方法. 10.    jQuery-在"类"层面扩展. 11.    jQuery-在"对象"层面扩展. 12.    jQuery-扩

Java程序员的JavaScript学习笔记 (目录)

终于完结了,历时半个月. 内容包括: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源码级解析. jQuery EasyUI源码级解析. Java程序员的JavaScript学习笔记(1——理念) Java程序员的JavaScript学习笔记(2——属性复制和继承) Java程序员的JavaScript学习笔记(3——this/call/apply) Java程序员的JavaScript学习笔记(4——this/闭包/getter/setter) Java

Java程序员的JavaScript学习笔记(14——扩展jQuery UI)

计划按如下顺序完成这篇笔记: Java程序员的JavaScript学习笔记(1--理念) Java程序员的JavaScript学习笔记(2--属性复制和继承) Java程序员的JavaScript学习笔记(3--this/call/apply) Java程序员的JavaScript学习笔记(4--this/闭包/getter/setter) Java程序员的JavaScript学习笔记(5--prototype) Java程序员的JavaScript学习笔记(6--面向对象模拟) Java程序员

Java程序员的JavaScript学习笔记(汇总目录)

终于完结了,历时半个月. 内容包括: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源码级解析. jQuery EasyUI源码级解析. Java程序员的JavaScript学习笔记(1--理念) Java程序员的JavaScript学习笔记(2--属性复制和继承) Java程序员的JavaScript学习笔记(3--this/call/apply) Java程序员的JavaScript学习笔记(4--this/闭包/getter/setter) Java

Java程序员的JavaScript学习笔记(5——prototype和Object内置方法)

计划按如下顺序完成这篇笔记: 理念. 属性复制和继承. this/call/apply. 闭包/getter/setter. prototype. 面向对象模拟. jQuery基本机制. jQuery选择器. jQuery工具方法. jQuery-在"类"层面扩展. jQuery-在"对象"层面扩展. jQuery-扩展选择器. jQuery UI. 扩展jQuery UI. 这是笔记的第5篇,聊聊prototype.内置的Object对象和Object对象的属性和

Java程序员的JavaScript学习笔记(2——属性复制和继承)

计划按如下顺序完成这篇笔记: 理念. 属性复制和继承. this/call/apply. this/闭包/getter/setter. prototype. 面向对象模拟. jQuery基本机制. jQuery选择器. jQuery工具方法. jQuery-在"类"层面扩展. jQuery-在"对象"层面扩展. jQuery-扩展选择器. jQuery UI. 扩展jQuery UI. 这是笔记的第2篇,聊聊属性复制和继承的事情.非常基础,同样,也非常重要. 一切皆

Java程序员的JavaScript学习笔记(7——jQuery基本机制)

计划按如下顺序完成这篇笔记: 理念. 属性复制和继承. this/call/apply. 闭包/getter/setter. prototype. 面向对象模拟. jQuery基本机制. jQuery选择器. jQuery工具方法. jQuery-在"类"层面扩展. jQuery-在"对象"层面扩展. jQuery-扩展选择器. jQuery UI. 扩展jQuery UI. 这是笔记的第7篇,聊聊jQuery基本机制,学习的同时,我们试图实现一个缩略版本的jQue

Java程序员的JavaScript学习笔记(1——理念)

计划按如下顺序完成这篇笔记: 理念. 关于属性复制. this和闭包. 应该熟悉的语法习惯. 面向对象模拟. jQuery基本机制. jQuery选择器. jQuery工具方法. jQuery-在"类"层面扩展. jQuery-在"对象"层面扩展. jQuery-扩展选择器. jQuery UI. 扩展jQuery UI. 每一篇也许几句话,也许长篇大论.短的可能是因为概念难理解,需要慢慢消化:长的,可能是因为内容多而且水,但不提又不行. 现在开始第1篇:理念. 众

Java程序员的JavaScript学习笔记(6——面向对象模拟)

计划按如下顺序完成这篇笔记: 理念. 属性复制和继承. this/call/apply. 闭包/getter/setter. prototype. 面向对象模拟. jQuery基本机制. jQuery选择器. jQuery工具方法. jQuery-在"类"层面扩展. jQuery-在"对象"层面扩展. jQuery-扩展选择器. jQuery UI. 扩展jQuery UI. 这是笔记的第6篇,对前面5篇做一个总结,聊聊JavaScript在面向大型复杂任务时候,如