js规范

 

匿名函数

要避免全局变量泛滥， 可以考虑使用匿名函数， 把不需要在外部访问的变量或者函数限制在一个比较小的范围内。

例如以下代码:

<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;