javascript 模式之模块模式


在进行模块化编程的时候,好多项目采用模块模式,因为其提供了结构化的思想并且有助于组织日益增长的代码。javascript和C++、java等面向对象的语言不同,它没有可以进行导入包的语法,,但是模块模块模式则提供了一种创建自包含非耦合的代码片段的有力工具。这也是现在好多项目采用此模式的原因。
好了,不废话了,现在开始深入,细解模块模式,其实是以下几种模式的组合:
一、命名空间模式
二、即时函数
三、声明依赖
四、私有和特权成员
一、建立一个命名空间函数

/**
* namespace(str)
* @param {string} 字符串
* @returns {object} 对象
*/
var zj={};
zj.namespace=function(str){
	var o=zj;
	var arr=str.split(".");
	for(var i=(arr[0]=='zj'?1:0),len=arr.length;i<len;i++){
		o=o[arr[i]]=o[arr[i]]||{};
	}
	return o;
}
zj.namespace("zj.util.dom");

二、下面使用即时函数,其可以提供私有作用域,该即时函数返回一个对象,即具有公共接口的实际模块,因此可以通过此接口来使用这些模块。

zj.util.dom=(function(){
	return {
		getId:function(id){
			return document.getElementById(id);
		},
		getClass:function(className){
			var arr=document.getElementsByTagName('*');
			for(var i=0,len=arr.length;i<len;i++){
				if(arr[i].getAttribute('class')==className){
					return arr[i];
				}else{
					return '无此对象';
				}
			}
		}
	}
})();


三、添加一些私有属性、特权方法:

zj.util.dom=(function(){
	//私有属性
	var _name='zhansan',
		_id='lisi';
	//私有方法
	function _xxx(){
		
	}
	//定义一些var 变量
	return {
		getId:function(id){
			return document.getElementById(id);
		},
		getClass:function(className){
			var arr=document.getElementsByTagName('*');
			for(var i=0,len=arr.length;i<len;i++){
				if(arr[i].getAttribute('class')==className){
					return arr[i];
				}else{
					return '无此对象';
				}
			}
		}
		
	};
})();


四、增加声明依赖

zj.namespace("zj.util.array");
var module=zj.namespace("zj.util.dom");
module=(function(){
	//声明依赖
	var arr=zj.util.array;
	//私有属性
	var _name='zhansan',
		_id='lisi';
	//私有方法
	function _xxx(){
		
	}
	//定义一些var 变量
	return {
		getId:function(id){
			return document.getElementById(id);
		},
		getClass:function(className){
			var arr=document.getElementsByTagName('*');
			for(var i=0,len=arr.length;i<len;i++){
				if(arr[i].getAttribute('class')==className){
					return arr[i];
				}else{
					return '无此对象';
				}
			}
		}
		
	};
})();


五、将全局变量导入到模块中

zj.namespace("zj.util.array");
var module=zj.namespace("zj.util.dom");
module=(function($,app){
	//声明依赖
	var arr=zj.util.array;
	//私有属性
	var name='zhansan',
		id='lisi';
	//私有方法
	function xxx(){
		
	}
	//定义一些var 变量
	return {
		getId:function(id){
			return document.getElementById(id);
		},
		getClass:function(className){
			var arr=document.getElementsByTagName('*');
			for(var i=0,len=arr.length;i<len;i++){
				if(arr[i].getAttribute('class')==className){
					return arr[i];
				}else{
					return '无此对象';
				}
			}
		}
		
	};
})(jQuery,MYAPP);

此文是自己几日来,看书所做总结,遇到同行看到此文,如果不同看法,欢迎留言。

转载请注明出处:始终坚信分享能提高自己、成就他人,I‘m Ben, 一直在路上,从未敢怠慢。

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值