zoukankan      html  css  js  c++  java
  • javaScript书写规范

    • 命名规范。
    常量名
        全部大写并单词间用下划线分隔
        如:CSS_BTN_CLOSETXT_LOADING
    对象的属性或方法名
        小驼峰式(little camel-case
        如:initbindEventupdatePosition
        示例:Dialog.prototype = {
                    init: function () {},
                    bindEvent: function () {},
                    updatePosition: function () {}
                   
                    };
    类名(构造器)
        -->小驼峰式但首字母大写
        -->如:CurrentDefaultConfig
    函数名
        -->小驼峰式
        -->如:current()、defaultConfig()
    变量名
        -->小驼峰式
        -->如:currentdefaultConfig
    私有变量名
        -->小驼峰式但需要用_开头
        -->如:_current_defaultConfig
    变量名的前缀
        -->续
    • 代码格式。
    "()"前后需要跟空格
    "="前后需要跟空格
    ","后面需要跟空格
    JSON对象需格式化对象参数
    ifwhilefordo语句的执行体用"{}"括起来

    “{}”格式如下。

    if (a==1) {
        //代码
    };

    避免额外的逗号。

    var arr = [1,2,3,];

    for-in循环体中必须用hasOwnProperty方法检查成员是否为自身成员,避免来自原型链上的污染。

    • 长语句可考虑断行。
    TEMPL_SONGLIST.replace('{TABLE}', da['results'])
        .replace('{PREV_NUM}', prev)
        .replace('{NEXT_NUM}', next)
        .replace('{CURRENT_NUM}', current)
        .replace('{TOTAL_NUM}', da.page_total);

    为了避免和JSLint的检验机制冲突,“.”或“+”这类操作符放在行尾。

    TEMPL_SONGLIST.replace('{TABLE}', da['results']).
        replace('{PREV_NUM}', prev).
        replace('{NEXT_NUM}', next).
        replace('{CURRENT_NUM}', current).
        replace('{TOTAL_NUM}', da.page_total);

    如果模块代码中,使用其它全局变量想跳过JSLint的检查,可以在该文件中加入/*global*/声明。

    /*global alert: true, console: true, top: true, setTimeout: true */
    • 使用严格的条件判断符。用===代替==,用!==代替!=,避免掉入==造成的陷阱,在条件判断时,这样的一些值表示false。
    null
    undefinednull相等
    字符串''
    数字0
    NaN

    在==时,则会有一些让人难以理解的陷阱。

    (function () {
        var undefined;
        undefined == null; // true
        1 == true; //true
        2 == true; // false
        0 == false; // true
        0 == ''; // true
        NaN == NaN;// false
        [] == false; // true
        [] == ![]; // true
    })();

    对于不同类型的 == 判断,有这样一些规则,顺序自上而下:

    undefinednull相等
    一个是number一个是string时,会尝试将string转换为number
    尝试将boolean转换为number
    01
    尝试将Object转换成numberstring

    而这些取决于另外一个对比量,即值的类型,所以对于0、空字符串的判断,建议使用===
    。===会先判断两边的值类型,类型不匹配时为false。

    • 下面类型的对象不建议用new构造。
    new Number
    new String
    new Boolean
    new Object //用{}代替
    new Array //用[]代替

    引用对象成员用obj.prop代替obj[“prop”],除非属性名是变量。

    • 从number到string的转换。
    /** 推荐写法*/
    var a = 1;
    typeof(a); //"number"
    console.log(a); //1
    var aa=a+'';
    typeof(aa); //"string"
    console.log(aa); //'1'
    /** 不推荐写法*/
    new String(a)或a.toString()

    从string到number的转换,使用parseInt,必须显式指定第二个参数的进制。

    /** 推荐写法*/
    var a = '1';
    var aa = parseInt(a,10);
    typeof(a); //"string"
    console.log(a); //'1'
    typeof(aa); //"number"
    console.log(aa); //1

    从float到integer的转换。

    /** 推荐写法*/
    Math.floor/Math.round/Math.ceil
    /** 不推荐写法*/
    parseInt

    字符串拼接应使用数组保存字符串片段,使用时调用join方法。避免使用+或+=的方式拼接较长的字符串,每个字符串都会使用一个小的内存片段,过多的内存片段会影响性能。

    /**推荐的拼接方式array的push、join*/
    var str=[],
        list=['测试A','测试B'];
    for (var i=0 , len=list.length; i < len; i++) {
        str.push( '<div>'+ list[i] + '</div>');
    };
    console.log(str.join('')); //<div>测试A</div><div>测试B</div>
    /** 不推荐的拼接方式+=*/
    var str = '',
        list=['测试A','测试B'];
    for (var i = 0, len = list.length; i< len; i++) {
        str+='<div>' + list[i] + '</div>';
    };
    console.log(str); //<div>测试A</div><div>测试B</div>
    • 尽量避免使用存在兼容性及消耗资源的方法或属性。
    不要使用withvoidevileval_rinnerText
    • 注重HTML分离, 减小reflow, 注重性能。

    收集整理了这些开发规范,感谢所有的原作者。

  • 相关阅读:
    ligerui的jquery.validate验证需要添加validate="{required:true,minlength:8,equalTo:'#newpassword'}"
    label标签利用jquery获取值得方式为$("#message").html()
    response.setHeader("xxx","大侠")如果赋值中文,那么将不会在页面出值,
    康动仪数据传输不成功可以用如下办法解决
    log4j添加日志一定记住在工程的web.xml文件下加一些内容
    jQuery 中$(this).parent().parent().remove()无效。
    uploads 上传图片
    jQuery 中的children()和 find() 的区别
    左右值编码,文章类别。无限级分类
    在Yii用createUrl中明明白白生成网址
  • 原文地址:https://www.cnblogs.com/hubl/p/5743780.html
Copyright © 2011-2022 走看看