编写可维护的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 来创建对象。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,524评论 5 460
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,869评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,813评论 0 320
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,210评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,085评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,117评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,533评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,219评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,487评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,582评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,362评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,218评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,589评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,899评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,176评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,503评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,707评论 2 335

推荐阅读更多精彩内容