第24 章 JavaScript最佳实践方式

24.1.4 编程实践

尊重对象所有权
如果你不负责创建或维护某个对象、它的对象或者它的方法，那么你就不能对它们进行修改。更具体地说：
 不要为实例或原型添加属性；
 不要为实例或原型添加方法；
 不要重定义已存在的方法。

永远不修改不是由你所有的对象。
所谓拥有对象，就是说这个对象是你创建的，比如你自己创建的自定义类型或对象字面量。
而Array、document 这些显然不是你的，它们在你的代码执行前就存在了。
你可以通过以下方式为对象创建新的功能：
 创建包含所需功能的新对象，并用它与相关对象进行交互；(包含)
 创建自定义类型，继承需要进行修改的类型。然后可以为自定义类型添加额外功能。（继承）

避免全局量
最多创建一个全局变量，让其他对象和函数存在其中。请看以下例子：

//两个全局量——避免！！
var name = "Nicholas";
function sayName(){
	alert(name);
}

其实可以创建一个包含两者的对象

//一个全局量——推荐
var MyApplication = {
	name: "Nicholas",
	sayName: function(){
		alert(this.name);
	}
};

单一的全局量的延伸便是命名空间的概念

//创建全局对象
var Wrox = {};

//为 Professional JavaScript 创建命名空间
Wrox.ProJS = {};
//将书中用到的对象附加上去
Wrox.ProJS.EventUtil = { ... };
Wrox.ProJS.CookieUtil = { ... };


//为Professional Ajax 创建命名空间
Wrox.ProAjax = {};
//附加该书中所使用的其他对象
Wrox.ProAjax.EventUtil = { ... };
Wrox.ProAjax.CookieUtil = { ... };


//ProJS 还可以继续分别访问
Wrox.ProJS.EventUtil.addHandler( ... );
//以及ProAjax
Wrox.ProAjax.EventUtil.addHandler( ... );

3.避免与null 进行比较
现实中，与null 比较很少适合情况而被使用。必须按照所期望的对值进行检查，而非按照不被期望的那些。
例如，在前面的范例中，values 参数应该是一个数组，那么就要检查它是不是一个数组，而不是检查它是否非null

function sortArray(values){
	if (values != null){ //避免！
		values.sort(comparator);
	}
}
//////////////////////////////////////////////////
**必须按照所期望的对值进行检查**
function sortArray(values){
	if (values instanceof Array){ //推荐
		values.sort(comparator);
	}
}

使用常量

例子：
function validate(value){
	if (!value){
		alert("Invalid value!");
		location.href = "/errors/invalid.php";
	}
}


改成例子：
var Constants = {
	INVALID_VALUE_MSG: "Invalid value!",
	INVALID_VALUE_URL: "/errors/invalid.php"
};
function validate(value){
	if (!value){
		alert(Constants.INVALID_VALUE_MSG);
		location.href = Constants.INVALID_VALUE_URL;
	}
}

 重复值——任何在多处用到的值都应抽取为一个常量。这就限制了当一个值变了而另一个没变
的时候会造成的错误。这也包含了CSS 类名。
 用户界面字符串 —— 任何用于显示给用户的字符串，都应被抽取出来以方便国际化。
 URLs —— 在Web 应用中，资源位置很容易变更，所以推荐用一个公共地方存放所有的URL。
 任意可能会更改的值 —— 每当你在用到字面量值的时候，你都要问一下自己这个值在未来是不
是会变化。如果答案是“是”，那么这个值就应该被提取出来作为一个常量。

24.2.1 注意作用域
1.避免全局查找
使用全局变量和函数肯定要比局部的开销更大，因为要涉及作用域链上的查找。

可以用局部变量做一个桥接

2.避免with 语句
在性能非常重要的地方必须避免使用with 语句。和函数类似，with 语句会创建自己的作用域，
因此会增加其中执行的代码的作用域链的长度。由于额外的作用域链查找，在with 语句中执行的代码肯定会比外面执行的代码要慢。

function updateBody(){
	with(document.body){
		alert(tagName);
		innerHTML = "Hello world!";
	}
}
这段代码中的with 语句让document.body 变得更容易使用。其实可以使用局部变量达到相同的
效果，如下所示：
function updateBody(){
	var body = document.body
	alert(body.tagName);
	body.innerHTML = "Hello world!";
}
虽然代码稍微长了点，但是阅读起来比with 语句版本更好，它确保让你知道tagName 和innerHTML 是属于哪个对象的。同时，这段代码通过将document.body 存储在局部变量中省去了额外的全局查找。

24.2.3 最小化语句数
3. 使用数组和对象字面量

//用4 个语句创建和初始化数组——浪费
var values = new Array();
values[0] = 123;
values[1] = 456;
values[2] = 789;

//用4 个语句创建和初始化对象——浪费
var person = new Object();
person.name = "Nicholas";
person.age = 29;
person.sayName = function(){
	alert(this.name);
};
这段代码中，只创建和初始化了一个数组和一个对象。各用了4 个语句：一个调用构造函数，其他
3 个分配数据。其实可以很容易地转换成使用字面量的形式，如下所示：

//只用一条语句创建和初始化数组
var values = [123, 456, 789];
//只用一条语句创建和初始化对象
var person = {
	name : "Nicholas",
	age : 29,
	sayName : function(){
		alert(this.name);
	}
};

第24 章 JavaScript最佳实践方式

猜你喜欢