编写可维护javascript学习笔记3

第四章 变量，函数和运算符

4.1 变量声明
	将所有的变量声明放在函数顶部而不是散落在各个角落

4.2 函数声明
	推荐先声明函数，在调用函数
	函数内部的局部函数应紧接着变量后面声明
	函数声明应当在条件语句外部使用

4.3 函数调用间隔
	调用写法是：在调用函数左边没有空格，这样是为了将它和块语句区分开来

4.4 立即调用的函数
	匿名函数可以赋值给变量
	为了让立即执行的函数能够被一眼看出来，可以将函数同一对原括号包裹出来
	例:
	var  value = (function(){
		
		//函数体
	
		return {
			message：“Hi”；
		}
	}());
	
4.5 严格模式
	通过指令
		“use strict”;
	指令脚本以严格模式执行
	最好不要再全局作用域中使用“use strict”

4.6 相等
	推荐使用 === 和 !==，因为==会在比较前进行强制类型转换
	(我个人觉得== 和 !=好用)

	4.6.1 eval()
		eval()会将传入的字符串当作代码来执行
		尽量不用

	4.6.2 原始包装类型
		禁止使用原始包装类型
		即：var s = new String("1111");

构建软件设计方法的方法有两种:一种是把软件做的简单以至于明显找不到缺陷;另一种是把它做的很复杂以至于找不到明显缺陷。

第五章 UI层的松耦合

5.1 什么是松耦合
	当你能够修改一个组件而不需要更改其他的组件时，你就做到了松耦合。

5.2 将javascript从css中抽离
	避免使用css表达式，避免在css中嵌入js代码

5.3 将css从Javascript中抽离
	最佳方法是操作css的className，而非直接修改样式

5.4 将javascript从html中抽离
	不用onClick等来调用方法，改变属性等

5.5 将html从javascript中抽离
	5.5.1 方法一：从服务器加载	
	5.5.2 方法二：简单客户端模板
	5.5.3 方法三：复杂客户端模板 

第六章 避免使用全局变量

var  color = "red";

function sayColor (){
	alert(color);	
}                                                             

console.log(window.color); //"red"
console.log(typeof window.sayColor ); //"function"

6.1 全局变量带来的问题
全局变量会导致一些非常重要的可维护难题

	6.1.1 命名冲突
	
	6.1.2 代码的脆弱性

	6.1.3 难以测试

6.2 意外的全局变量

6.3 单全局变量模式
	6.3.1 命名空间
	6.3.2 模块

6.4 零全局变量

第七章 时间处理

7.1 典型用法
7.2 规则1：隔离应用逻辑
	var MyApplication = {
		handleClick:function(event){
			this.showPopup(event);
		},

		showPopup:function(event){
			var popuo = document.getElementByid("popup");
			popup.style.left = event.clientX + "px";
			popup.style.top = event.clientY + "px";
			popup.className = "reveal";
		}
	};

	addListener(element,"click",function(event){
		MyApplication.handleClick(event)
	});
	
7.3 规则2:不要分发事件对象
	var MyApplication = {
		handleClick:function(event){
			this.showPopup(event.clientX，event.clientY);
		},

		showPopup:function(x，y){
			var popuo = document.getElementByid("popup");
			popup.style.left = x + "px";
			popup.style.top = y + "px";
			popup.className = "reveal";
		}
	};

	addListener(element,"click",function(event){
		MyApplication.handleClick(event)
	});