匿名函数
要避免全局变量泛滥, 可以考虑使用匿名函数, 把不需要在外部访问的变量或者函数限制在一个比较小的范围内。
例如以下代码:
<script>
function func1(){
var list = ["a", "b", "c"];
for(var i = 0; i < list.length; i++){
//..
};
}
func1(); // 自动运行
</script>
这段代码的作用是在页面加载的时候自动执行某些操作, 并不需要被外部调用, 但是它执行过后却留下了一个全局的函数。
像这种情况, 非常有必要使用匿名函数:
<script>
(function func1(){
var list = ["a", "b", "c"];
for(var i = 0; i < list.length; i++){
//..
};
})(); // 自动运行
</script>
匿名函数的格式:
(function(){
// 代码块
})();
如果要带参数的话:
(function(arg1, arg2, argN){
//..
})(arg1, arg2, argN);
命名空间
还有另外一个方法可以减少全局变量, 那就是命名空间, 在JS中可以用"对象-属性"来模拟命名空间;
window.com = {}
window.com.bytter = {}
window.com.bytter.hello = function(){
alert("hello");
}
如果你要给某个已经存在的页面增加功能, 可能要增加十多个函数, 而那个页面已经存在大量的全局变量和函数, 甚至还有函数跟你新增的函数同名, 怎么办?
命名空间是比较好的选择, 你可以创建一个命名空间, 把你的新函数都放在那个命名空间之下, 例如:
<button type="button" onclick="pg.check.userAcc()">检查用户名</button>
<button type="button" onclick="pg.check.userAcc()">检查帐号</button>
<script>
window.pg = {}
window.pg.check = {
// 检查用户名
userName: function(){
//..
},
// 检查帐号
userAcc: function(){
//..
}
};
</script>
互不干扰
结合上述的匿名函数和命名空间的使用, 可以把一个页面中自己维护的代码与其它的代码分隔开来, 将与外部代码的耦合降低到最小。
<script>
// 页面命名空间
window.pg = {}
// 检查用户信息
// 作者:张三
// 最后更新: 2012.12.31
(function(){
// 私有变量
var a, b, c;
// 检查用户信息的相关方法
window.pg.check = {
// 检查用户名
userName: function(){
//..
},
// 检查帐号
userAcc: function(){
//..
}
};
})(); // end 张三的代码
// xxx功能
// 作者:李四
// 最后更新: 2012.1.1
(function(){
window.pg.xxx = {
//..
}
})(); // end 李四的代码
</script>
变量声明
变量必须在使用前用var进行声明;
变量的声明应该放在代码块或者函数的头部;
可在一行内声明多个变量, 但要考虑美观易读;
// 银行名称, 银行帐号
var type, acc;
// 银行名称, 银行帐号
var type = "中国银行", acc = "xxxxxx";
var type = "中国银行", // 银行名称
acc = "xxxxxx"; // 银行帐号
尽量使用易于理解的变量名,如:
var bankType = "中国银行",
bankAccount = "xxxxxx";
命名
普通变量名和函数名采用"小驼峰式命名法", 如:firstName、lastName
作为构造函数的函数采用"大驼峰式命名法", 如:
var Person = function(){
//..
}
var me = new Person();
常量用大写和下划线表示,如:
var ROOT_PATH = "/v10/";
分号
每条语句必须使用分号结尾(特别是需要压缩的js,省略分号常常会导致压缩失败);
大括号
if语句、函数定义、try语句等带大括号的结构, 左大括号应紧跟前面的部分:
// good
var Person = function(){
//..
}
// bad
var Person = function()
{
//..
}
使用复合语句时不要省略大括号{}
// good
for(var i = 0; i < ary.length; i++){
list.push(ary[i]);
}
// bad
for(var i = 0; i < ary.length; i++)
list.push(ary[i]);
以提高代码可读性为前提,允许例外:
if(!data) return;
if(row) list.push(row);
空格
数值操作符(如, +/-/*/% 等)、比较符(大于、小于、等于)两边留空格;
逗号、冒号、分号后要留一个空格(如果后面还有内容的话);
行尾不要有空格;
点号前后不要出现空格;
函数名末尾和左括号之间不要出现空格;
字符串
表示字符串用单引号或双引号均可, 建议统一使用双引号,
但表示html标签时一律使用单引号, 如:
var html = '<div class="msg" ></div>';
数组
使用简便的方式定义数组:
// good
var list = [1, 2, 3];
// bad
var list = new Array();
list[0] = 1;
list[1] = 2;
list[2] = 3;