JavaScript重构（十）：强化对象封装和模块封装

1、类本身就是一种封装形式，先来看看最简单的封装，JavaScript中没有private关键字，对于私有成员，不如我们统一一个以下划线开头的命名来标识：

var User = function(name){
	this._name = name;
	this.getName = function(){
		return _name;
	};
};

 

 

2、不过，上面的办法还不够好，我依然可以用user._name访问到这个变量。现在换个思路，通过使用var来定义User中的name属性，并且通过getName方法来给它暴露访问入口，实现了private一样的效果：

var User = function(name){
	var name = arguments[0];
	this.getName = function(){
		return name;
	};
};
User.SORT = 1;

var user = new User("Test");
alert(user.getName());	//正确打印
alert(user.name);		//封装起来的私有成员，不能随意访问
alert(User.SORT);		//类变量

 

 

3、通过匿名方法，把代码块的影响范围限制在一定区域内：

(function($){
	$.fn.extend({
		sayHi : function(){
			alert("Hi: " + this.get(0).tagName);
		}
	});
})(jQuery);

jQuery("body").sayHi();

 上例中，外部由于命名冲突的关系，无法使用“$”来获取jQuery的引用，但是通过这样匿名函数的调用，在函数实现内部依然可以使用到“$”，并且给JQuery的原型增加了一个sayHi的方法。

 

 

4、命名空间带来的封装，参见这篇博客。

 

 

5、通过合理规约JS文件的依赖关系和加载执行顺序，保证区域代码执行时对外部的访问范围：

//首先加载URLUtil的类定义，再加载User的类定义，保证了依赖关系是User依赖于URLUtil，而不会倒置，避免了在URLUtil的代码区域附近去访问User对象
var URLUtil = {
	getURL : function(){
		return "http://xxx";
	}
};

……

var User = function(){
	var url;
	this.setURL = function(newUrl){
		url = newUrl;
	};
};

……

var user = new User();
user.setURL(URLUtil.getURL());

 

 

JavaScript重构系列，请访问此链接。

 

文章系本人原创，转载请注明作者和出处