开发者社区> 异步社区> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

《编写可维护的JavaScript》——第 1 章 基本的格式化 1.1缩进层级

简介: 关于JavaScript编码风格,我们首先要讨论的是(几乎所有的语言都是如此)如何处理缩进。对这个话题是可以争论上好几个小时的,缩进甚至关系到软件工程师的价值观。在确定编程风格之初应当首先确定缩进格式,这非常重要,以免工程师后续会陷入那个老生常谈的打开文件时二话不说先重排代码缩进的问题之中。
+关注继续查看

本节书摘来自异步社区《编写可维护的JavaScript》一书中的第1章,第1.1节,作者:【美】Nicholas C. Zakas著,更多章节内容可以访问云栖社区“异步社区”公众号查看

第 1 章 基本的格式化

编程风格指南的核心是基本的格式化规则(formatting rule)。这些规则直接决定了如何编写高水准的代码。与在学校学习写字时所用的方格纸类似,基本的格式化规则将指引开发者以特定的风格编写代码。这些规则通常包含一些你不太在意的有关语法的信息,但对于编写清晰连贯的代码段来说,每一条信息都是非常重要的。
1.1 缩进层级
关于JavaScript编码风格,我们首先要讨论的是(几乎所有的语言都是如此)如何处理缩进。对这个话题是可以争论上好几个小时的,缩进甚至关系到软件工程师的价值观。在确定编程风格之初应当首先确定缩进格式,这非常重要,以免工程师后续会陷入那个老生常谈的打开文件时二话不说先重排代码缩进的问题之中。来看一下这段代码(为了演示,这里故意修改了示例代码的缩进)。

if (wl && wl.length) {
               for (i = 0, l = wl.length; i < l; ++i) {
          p = wl[i];
          type = Y.Lang.type(r[p]);
          if (s.hasOwnProperty(p)) { if (merge && type == 'object') {
      Y.mix(r[p], s[p]);
} else if (ov || !(p in r)) {
                        r[p] = s[p];
               }
        }
    }
}

快速读懂这段代码并不容易。这里的缩进并不统一,一眼看去else是对应到第1行的if语句。但实际上这个else和代码第5行的if语句相对应。罪魁祸首是多位开发人员在同一段代码里应用了不同的缩进风格。这恰恰说明了统一缩进风格的重要性。如果有适当的缩进,这段代码将变得更加易读。

if (wl && wl.length) {
     for (i = 0, l = wl.length; i < l; ++i) {
          p = wl[i];
          type = Y.Lang.type(r[p]);
          if (s.hasOwnProperty(p)) {
               if (merge && type == 'object') {
                    Y.mix(r[p], s[p]);
               } else if (ov || !(p in r)) {
                    r[p] = s[p];
               }
          }
     }
}

坚持使用适度的缩进是万里长征的第一步—本章在下面将提到这种做法可以带来其他可维护性方面的提升。

对于大多数编程风格来说,代码到底应该如何缩进并没有统一的共识。有两种主张。

使用制表符进行缩进

每一个缩进层级都用单独的制表符(tab character)表示。所以一个缩进层级是一个制表符,两个缩进层级为两个制表符,以此类推。这种方法有两个主要的好处。第一,制表符和缩进层级之间是一对一的关系,这是符合逻辑的。第二,文本编辑器可以配置制表符的展现长度1,因此那些想修改缩进尺寸的开发者可以通过配置文本编辑器来实现,想长即长,想短可短。使用制表符作缩进的主要缺点是,系统对制表符的解释不一致。你会发觉在某个系统中用一款编辑器打开文件时看到的缩进,和在另外一个系统中用相同的编辑器打开文件时看到的不一样。对于那些追求(代码展现)一致性的开发者来说,这会带来一些困惑。这些差异、争论会导致不同的开发者对同一段代码有不同的看法的,而这些正是团队开发需要规避的。

使用空格符进行缩进

每个缩进层级由多个空格字符组成。在这种观点中有三种具体的做法:2个空格表示一个缩进,2个空格表示一个缩进,以及8个空格表示一个缩进。这三种做法在其他很多编程语言中都能找到渊源。实际上,很多团队选择4个空格的缩进,对于那些习惯用2个空格缩进和用8个空格缩进的人来说,4个空格缩进是一种折中的选择。使用空格作缩进的好处是,在所有的系统和编辑器中,文件的展现格式不会有任何差异。可以在文本编辑器中配置敲击Tab键时插入几个空格。也就是说所有开发者都可以看到一模一样的代码呈现。使用空格缩进的缺点是,对于单个开发者来说,使用一个没有配置好的文本编辑器创建格式化的代码的方式非常原始。

尽管有人争辩说应当优先考虑使用一种缩进约定,但说到底这只是一个团队偏好的问题。这里我们给出一些各式各样的缩进风格作为参考。

  • jQuery核心风格指南(jQuery Core Style Guide)明确规定使用制表符缩进。
  • Dauglas Crockford的JavaScript代码规范(Douglas Crockford’s Code Conventions for the JavaScript Programming Language)规定使用4个空格字符的缩进。
  • SproutCore风格指南(SproutCore Style Guide)规定使用2个空格的缩进。
  • Goolge的JavaScript风格指南(Google JavaScript Style Guide)规定使用2个空格的缩进。
  • Dojo编程风格指南(Dojo Style Guide)规定使用制表符缩进。

我推荐使用4个空格字符为一个缩进层级。很多文本编辑器都默认将缩进设置为4个空格,你可以在编辑器中配置敲入Tab键时插入4个空格。使用2个空格的缩进时,代码的视觉展现并不是最优的,至少看起来是这样。

尽管是选择制表符还是选择空格做缩进只是一种个人偏好,但绝对不要将两者混用,这非常重要。这么做会导致文件的格式很糟糕,而且需要做不少清理工作,就像本节的第一段示例代码显示的那样。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
如何用 JavaScript 编写你的第一个单元测试
测试代码是确保代码稳定的第一步。能做到这一点的最佳方法之一就是使用单元测试....
0 0
PubSubJS:用JavaScript编写的基于主题的发布/订阅库
PubSubJS:用JavaScript编写的基于主题的发布/订阅库
0 0
【Javascript】学习使用mocha(摩卡)编写测试用例-常用命令
【Javascript】学习使用mocha(摩卡)编写测试用例-常用命令
0 0
8 种技巧让你编写更简洁的 JavaScript 代码
8 种技巧让你编写更简洁的 JavaScript 代码
0 0
SAP CRM webclient ui里直接编写原生的JavaScript
SAP CRM webclient ui里直接编写原生的JavaScript
0 0
编写可维护的JavaScript
软件生命周期中80%的成本都消耗在了维护上;而且几乎所有的维护者都不是代码的直接开发人。如何让自己写的代码让别人阅读起来更高效?当然是写代码的时候注入一些规范。那么在Javascript中有哪些编程风格值得我们去注重呢?这篇文章将总结《编写可维护的JavaScript》里面的观点。
1163 0
用JavaScript编写Chip-8模拟器
我相信大多数人都用模拟器玩过游戏吧!比如GBA模拟器,PSP模拟器,NES模拟器等。所以应该也有人会跟我一样想自己写个游戏机模拟器。但这些模拟器对于一个新手来说难度太大了,就比如NES模拟器中CPU的指令就有100个以上了,更别说除了CPU还有显卡之类的东西需要模拟。
946 0
javascript + sql编写SQL客户端工具tabris
祝大家2018新年快乐, 前不久发现了一个创意的脚本JtSQL(java编写) 开源地址为:https://github.com/noear/JtSQL JtSQL 特点:*.结合了JS、SQL、模板理念;*.
727 0
+关注
异步社区
异步社区(www.epubit.com)是人民邮电出版社旗下IT专业图书旗舰社区,也是国内领先的IT专业图书社区,致力于优质学习内容的出版和分享,实现了纸书电子书的同步上架,于2015年8月上线运营。公众号【异步图书】,每日赠送异步新书。
文章
问答
文章排行榜
最热
最新
相关电子书
更多
Javascript中的函数
立即下载
Javascript异步编程
立即下载
JS零基础入门教程(上册)
立即下载