来自尼古拉斯的编码风格

    千里之行始于足下,学好如何编程得先慢慢培养编码风格的好习惯。
    就像我们小学时语文老师经常叫我们练字一般,我们不必懂得写的字是什么意思,而注重一笔一划的书写。写的一手漂亮的字会为你的人格增添魅力。
    当然,写的一手好风格的代码也是程序员必须养成的习惯。
    最近在看尼古拉斯的《如何编写可维护的javascript》。尼古拉斯,雅虎首页首席前端专家,可以说是js教父般的人物。
    读完他的这本书,深深地被他的代码风格所吸引。我部门大佬也十分推崇。
    如果说朋友们还在写着如下风格的代码:
    var a=5;
    var b=5;
    var c;
    function add(){
        for(var i=0;i<a;i++){
            for(var j=0;j<b;j++){
                c+=i*j;
            };
        };
    };
    虽然这没什么错。但是风格不优美。请看下面。
    var a = 5,
        b = 5,
        c;

    function add() {
        var i, j;

        for(i = 0; i < a; i++) {

            for(j = 0; j < b; j++) {
                c += i * j;
            };
        };
    };
    有规则的使用空格还有留白。可以使代码可阅读性大大加强。
    或许在这里你看不出来效果,那么建议复制下来放进编辑器里,那样会明显的多。当代码长度成百上千之后,你会发现这样的格式对你的眼睛是一种保护。
    尼古拉斯在升任首席前端工程师后,就是在部门内倡导这样的代码风格,此后他们的团队工作效率大大提升。
    如果说你现在才刚开始学习JS。养成这样的好习惯对你有益无害。因为你迟早会融入一个团队。
    团队的每个人的编码风格要趋向统一。而这样的风格在大大小小的团队里相差无几。
    在尼古拉斯的这本书里,我总结了以下的编码风格,如果大家并没有看过这本书我向大家推荐。

    /*
    * 缩进 一个层级 = 4个空格 避免用tab缩进
    */

    //好的写法
    if  (true)  {
        doThing();
    };

    /*
    * 行长不超过80字符,如超过则应在一个运算符(逗号,加号等)后换行。
    * 下一行增加两级缩进 = 8个空
    */

    //好的写法
    doThing (ag1, ag2, ag3, ag4,
            ag5);

    //不好的写法
    doThing(ag1, ag2, ag3, ag4,
        ag5);

    /*
    * 原始值 字符串始终双引号且保持一行。避免使用斜线另起一行。
    */

    //好的写法
    var name = "zhanglinfeng";
    var name = "zhanglin" + 
               "feng";

    //不好的写法
    var loacal = "here is my work \
    name body";

    /*
    *数字应当使用十进制整数,科学计数法表示整数,十六进制整数, 或者十进制浮点小数,小数点前后应当至少保留一位数字。避免八进制直接量。
    */

    //好的写法
    var count = 10;
    var price = 10.0;
    var price = 10.00;
    var num = 0xA2;
    var num = 2e23;

    //不好的写法
    var price = 10.;
    var price = .1;
    var num = 010;

    //特殊值null除了以下情况避免使用

    /*
    * 用来初始化一个变量,这个变量可能被赋值为一个对象
    * 用来和一个已经初始化的变量比较,这个变量可以是也可以不是一个对象
    * 当函数的参数期望是对象时,被用作参数传入
    * 当函数的返回值期望是对象时,可用作返回值传出
    */

    //好的写法
    var person = null;

    function getPerson() {

        if (condition) {
            return new Person("zhanglinfneg");
        } else {
            return null;
        };
    };

    var person = getPerson();

    if (person !== null) {
        doThing();
    };

    //不好的写法 和一个未被初始化的变量比较
    var person;

    if (person != null) {
        doThing();
    }

    //不好的写法: 通过测试判断某个参数是否被传递
    function doThing(a1, a2, a3) {

        if (a1 != null) {
            doThing();
        }
    };

    //避免使用undefined。判断变量定义该用typeof

    //好的写法
    if (typeof va == "undefined") {
        doThing();
    }

    //不好的写法:使用直接量
    if (va == undefined) {
        doThing();
    }

    /*
    * 运算符间隔
    * 二元运算符前后一个空格保持整洁。操作符包括赋值运算符和逻辑运算符
    */

    //好的写法
    var a = (value === item) ;

    if (found && (count > 10)) {
        doThing();
    };

    for(var i = 0; i < conunt; i++) {
        doThing();
    };

    //括号间距。左括号和右括号前不能有空格 例子同上

    //对象直接量

    /*
    * 起始左花括号应当同表达式保持同一行
    * 每个属性的名值对应当保持一个缩进,第一个属性在左花括号后另起一行
    * 每个属性的名值对应应当使用不含引号的属性名,后紧跟: 后值
    * 倘若属性为函数类型,函数体应当在属性名之下另起一行,而且前后均应保留一个空行
    * 一组相关的属性前后可以插入空行以提升代码的可读性
    */

    //好的写法
    var object = {
        kery: 12,
        ker2: 21,

        func: function() {
            doThing();
        },

        kery3: 21
    };
    doThing({
        key1: 12,
        key2: 21
    });

    //注释

    /*
    * 单行注释用来说明一行代码或者一组相关的代码。三种使用方式
    * 独占一行,用来解释下一行
    * 在代码尾部的注释,用来解释之前的代码
    * 多行,用来注释掉一个代码块
    */

    //好的写法
    if (condition) {

        //dasdsds
        allowed();
    }
    var result = dad + mod; //sdsds

    /*
    * 多行注释应当在代码需要更多文字去解释时使用。
    * 每个多行注释至少有三行
    */

    /*
    * 注释声明可以用来给一段代码申明额外的信息。这些申明以单个单词打头并紧跟一个冒号。
    * 可使用如下声明
    */

    TODO//说明代码未完成。应当包含下一步要做的事。
    HACK//表明代码实现走了一个捷径。应当包含为何使用hack的原因
    XXX//说明代码有问题应当尽快修复
    FIXME//说明代码有问题需要尽快修复。重要性次于XXX。
    REVIEW//说明代码任何可能的改动需要评审

    //好的写法

    //TODO:我希望找到更好的办法

    /*
    * HACK:不得不用特殊处理
    * 后续改
    */

    //REVIEW

    /*
    * 变量声明。所有变量在使用前应当事先定义。放在函数开头,使用一个var。
    * 初始化的变量要放在未初始化之前。
    * 
    */

    //好的写法
    var count = 10,
        name = "zhanglinfneg",
        found = true,
        age;

    //函数申明 

    /*
    * 使用前先定义,格式如下
    * 在函数内部的定义函数应当在var后立刻定义
    */

    function doThing() {
        doThing();
    };

    object.say = function() {

        //代码
    };

    //立刻被调用的函数应当在函数调用的外层用圆括号包裹
    var value = (function() {

        //代码
    } ());

    //命名。不要在任何命名中使用$\。

    //驼峰式.函数中最好不要下划线。变量用名词首字母小写后面单词首字母大写。函数第一单词动词首字母小写 如isArray isFunction setMuneu
    var countNumber = 10;

    function doThing() {

        //代码
    };

    //构造函数首字母大写 。非动词开头。首字母均大写

    function MyObject() {

        //代码
    };

    //常量 所有字母大写。单词间下划线分开。
    var TOTAL_NUMBER = 10;

    //对象私有属性同变量规则一样。加下划线
    var object = {
        _name: 10,

        _getCount: function() {

            //代码
        }
    };

    //严格模式仅限在函数内部使用,不要在全局使用。

    //三元操作符要用在赋值语句中

    //尽量用=== 和!==代替==和!=

    //for里尽量不声明变量。ffor-in用hasOwnProperty双重检查过滤对象成员。

    //switch while do for try 前留白。
    switch(value) {
        case 1: 

        case 2:
            doThing();
            break;

        case 3:
            return true;
    };

    try {

        //代码
    } catch (vaf) {

        //代码
    };

    /*
    * 留白两行空行:
    * 不同的源代码文件
    * 类和接口定义
    * 
    * 单行空行:
    * 方法之间
    * 方法中局部变量和第一行语句之间
    * 多行注释和单行注释之前
    * 方法中逻辑代码块之间
    *
    * 空格出现的地方:
    * 关键词后很括号的情况
    * 参数列表逗号后
    * 所有除了.的二元运算符。一元运算符不用
    * for中的表达式应当空格隔开
    * 
    * 避免字面量包装类型,eval(), with()
    */
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值