《编写可维护的JavaScript》——JavaScript编码规范(一)

缩进层级

代码如何缩进通常有两种主张:

使用制表符缩进

每一个缩进层级都用单独的制表符表示。这种方法的主要缺点是:系统对制表符的解释不一致。这些差异会导致不同的开发者对同一段代码有不同的看法的,这正是团队开发需要规避的

使用空格符缩进

每个缩进层级是由多个空格字符组成。在这种观点钟有三种具体的做法:2个空格表示一个缩进,4个空格表示一个缩进,以及8个空格表示一个缩进。这三种做法在其他很多编程语言中都能找到渊源。实际上,很多团队选择4个空格的缩进。缺点是:对于单个开发者来说,使用一个没有配置好的文本编辑器创建格式化的代码的方法非常原始。

尽管选择制表符还是空格做缩进只是一种个人偏好,但绝对不要将两者混用,这会导致文件的格式很糟糕

语句结尾

有赖于分析器的自动分号插入(ASI)机制,JavaScript代码省略号也是可以正常工作的。ASI会自动寻找代码中应当使用分号但实际没有分号的位置,并插入分号。大多数场景下ASI都会正确插入分号,但ASI得分号插入规则非常复杂且难记住,因此不推荐省略分号,看一下下面这段代码:

//原始代码
function getData(){
    return
    {
        title:"JavaScript"
     }
}
//分析器会将它理解成
function getData(){
    return;
    {
        title:"JavaScript"
     };
}

在这段代码中,return之后另起了一行,导致return后被插入了一个分号,这会导致函数返回值是undefined

可以通过将左花括号移至与return同一行的位置来修复这个问题。

//这段代码正常工作,尽管没有用分号
function getData(){
    return{
        title:"JavaScript"
     }
}

当某个场景我们认为不需要插入分号而ASI认为需要插入时,常常会产生错误。所以推荐总是使用分号。

行的长度以及换行

如果一行代码太长,编辑窗口出现了横向滚动条,会让开发人员感觉很别扭。

很多语言的编程规范都提到一行代码最长不应超过80个字符。

当一行长度达到了单行最大字符数限制时,就需要手动将一行拆成两行。通常我们会在运算符后换行,下一行会增加两个层级的缩进。

//好的做法:在运算符后换行,第二行增加两个缩进
callAFunction(document, element, window, "some string value", true, 123,
            navigator);
//不好的做法:在运算符之前换行了
callAFunction(document, element, window, "some string value", true, 123
           , navigator);

在这个例子中,逗号是一个运算符,应当作为前一行的行尾。这个换行位置非常重要,因为ASI机制会在某些场景下在行结束位置插入分号,而总是将一个运算符置于行尾,ASI就不会自作主张地插入分号,也就避免了错误的发生。

换行规则有一个例外:当给变量赋值时,第二行的位置和赋值运算符的位置保持对齐。比如:

var result = something + anotherThing + yetAnotherThing + somethingElse +
                   anotherSomethingElse;

这段代码里,变量anotherSomethingElse和首行的something保持左对齐。确保代码的可读性,并能一眼看清楚这行文本的上下文。

空行

在编码规范中,空行常常是被忽略的一个方面。有时一段代码的语义和另一段代码不可相关,这时就应该使用空行将它们分割,确保语义有关联的代码展现在一起。一般来讲,在下面这些场景中添加空行也是不错的主意:

1,在每个流控制语句之前(比如if和for语句)添加空行;

2,在方法之间;

3,在方法中的局部变量和第一条语句之间;

4,在多行或单行注释之前;

5,在方法内的逻辑片段之间插入空行,提高可读性。

但并没有一个编程规范对空行的使用给出任何具体建议,Crockford的编程规范也只提到要审慎地使用空行。

<!--

作者:纤锐
出处:http://www.cnblogs.com/beginner2014
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。谢谢合作。

-->

原文地址:https://www.cnblogs.com/beginner2014/p/5394511.html