编写可维护的JavaScript代码——代码规范

命名:

使用驼峰式大小写法。

  • 变量前缀用名词,函数前缀用动词,常量使用大写字母和下划线组合,构造函数使用大驼峰命名法,且为名词。

直接量

  • 字符串:使用双引号括起来,也可以用单引号括起来。在使用双括号括起来的字符串里都需要对双引号进行转义。如:
    <code>var name = "Nicholas says, "Hi."";</code>
    多行字符串用 + 号连接。
  • 数字:不能省略小数之前和小数之后的数字,不要使用八进制直接量。
  • null:不能用于比较未初始化的变量。
  • undefined:避免使用undefined。
  • 对象直接量:推荐如下方式创建对象:
    var book = {
        title: "Maintainable JavaScript",
        author: "Nicholas C. Zakas"
    };
    
  • 数组直接量:不赞同显式使用Array构造函数来创建数组,推荐使用两个方括号将数组初始化元素括起来。如:
    <code>var colors = [ "red", "green", "blue" ];</code>

注释

  • 单行注释
    • 独占一行的注释,用来解释下一行代码。这行注释之前总是有一个空行,且缩进层级和下一行代码保持一致。
    • 在代码行的尾部的注释。代码结束到注释之间至少有一个缩进。注释不能超过单行最大长度,否则放到改行代码之上。
    • 被注释的大段代码,不能用于注释大段的文字。
  • 多行注释,如:
/* 
   * 另一段注释
   * 这段注释包含两行文本
   */

语句和表达式

  • 块语句间隔:在括左圆之前和右圆括号之后各添加一个空格。比如:
if (condition) {
      doSomething();
}
  • switch 语句
    • 缩进:每条case语句相对于switch关键字都缩进一个层次;从第二条case语句开始,每条case语句前后各有一个空行。
    • case语句连续执行:在有意连续执行的位置添加注释。
switch (condition) {
          case "first":

              // fall through
          default:

              //code
}
  • with 语句:避免使用
  • for 循环:尽量避免使用 continue
  • for-in 循环:for-in 循环是用来遍历对象属性的,不要用来遍历数组成员。在for-in循环使用 hasOwnProperty() 来为for-in循环过滤出实例属性,除非想找原型链。

变量、函数和运算符

  • 变量声明:首先要知道的是,在函数内部任意地方定义的变量和在函数顶部定义变量是完全一样的。
    例如:
function doSomethings () {

      var result = 10 + value;
      var value = 10;
      return result;
}

相当于:

function () {

      var result;
      var value;

      result = 10 + value;
      value = 10;

      return result;
}

两个var语句提前至函数的顶部;初始化逻辑紧跟其后。在第六行用到变量value的时候它的值是一个特殊的 undefined,因此result的值就是 NaN。在那之后value才最终赋值为10。
例如:

function doSomethingWithItems (items) {

      for (var i=0, len=item.length; i < len; i++) {
          doSomething(items[i]);
      }
}

相当于

function doSomethingWithItems (items) {

      var i, len;

      for (i=0, len=items.length; i < len; i++){
          doSomething(items[i]);
      }
}

推荐使用:将所有的var语句合并为一个语句,每个变量的初始化独占一行。赋值运算符应当对齐。对于那些没有初始化的变量来说,它们应当出现在var语句的尾部。

  • 函数声明:函数声明也会被JavaScript提前。
    内部函数的局部函数应当紧接着变量声明之后,并且,函数声明不应当出现在语句块之内

  • 函数调用间隔:函数调用时,在函数名和左括号之间没有空格,这样做的目的是未来将它和块语句区分开来。

  • 立刻调用的函数:JavaScript允许声明匿名函数,并将匿名函数赋值给变量或者属性。

    推荐使用:在最后加上一对圆括号来立即执行并返回一个值,然后将这个值赋值给变量。而为了让立即执行的函数能够被一眼看出来,可以将函数用一对圆括号包裹起来。

    例如:

var value = (function () {

      // 函数体
      return {
          message: "Hi"
      }
} () );
  • 严格模式:推荐使用严格模式,但是最好不要再全局作用域中使用 "use strict" 。如果你希望在多个函数中应用严格模式而不必写很多行的 "use strict" ,那么可以使用立刻执行的函数。
    如下:
(function () {

      "use strict";
      function doSomething () {
          // 代码
      }
      function doSomethingElse () {
          // 代码
      }
}) ();
  • 相等:由于JavaScript具有强制类型转换机制,因此JavaScript在比较是时候,会将比较的内容转化被比较内容的类型在进行比较。如:
    <code>console.(5 == "5"); // true</code>

推荐使用:使用 ===!== 进行比较,当两者类型不相同的时候,认为两者不相等。

  • eval():在JavaScript中,eval()的参数为一个字符串,eval()会将传入的参数当作代码来执行。但是一般情况,只有涉及到回调中解释 JSON 的情形和或者将 Ajax 的返回值转换为JavaScript值的场景下才使用eval()。
  • 原始包装类型:避免使用 StringNumberBoolean 来创建对象。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容