缩进层级

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

使用制表符缩进

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

使用空格符缩进

每个缩进层级是由多个空格字符组成。在这种观点钟有三种具体的做法: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
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。谢谢合作。

-->

《编写可维护的JavaScript》——JavaScript编码规范(一)的更多相关文章

  1. 如何编写可维护的面向对象JavaScript代码

    能够写出可维护的面向对象JavaScript代 码不仅可以节约金钱,还能让你很受欢迎.不信?有可能你自己或者其他什么人有一天会回来重用你的代码.如果能尽量让这个经历不那么痛苦,就可以节省不少时 间.地 ...

  2. [转]JavaScript程序编码规范

    原文:http://javascript.crockford.com/code.html 作者:Douglas Crockford 译文:http://www.yeeyan.com/articles/ ...

  3. 转发一个javascript的编码规范

    google出品:http://chajn.org/jsguide/javascriptguide.html

  4. 浅谈 JavaScript 编程语言的编码规范

    对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编 ...

  5. 【转发】网易邮箱前端技术分享之javascript编码规范

    网易邮箱前端技术分享之javascript编码规范 发布日期:2013-11-26 10:06 来源:网易邮箱前端技术中心 作者:网易邮箱 点击:533 网易邮箱是国内最早使用ajax技术的邮箱.早在 ...

  6. 网易前端JavaScript编码规范

    在多年开发邮箱webmail过程中,网易邮箱前端团队积累了不少心得体会,我们开发了很多基础js库,实现了大量前端效果组件,开发了成熟的opoa框架以及api组件,在此向大家做一些分享.今天想先和大家聊 ...

  7. 网易邮箱前端Javascript编码规范:基础规范

    在多年开发邮箱webmail过程中,网易邮箱前端团队积累了不少心得体会,我们开发了很多基础js库,实现了大量前端效果组件,开发了成熟的opoa框架以及api组件,在此向大家做一些分享.今天想先和大家聊 ...

  8. Java 编码规范有感

    应小组要求,开发测试都需要考阿里编码规范,因此,相当于是突击了一下关于编码规范方面的知识,目前做的项目后期需要进行项目迁移,数据迁移,功能迁移... 各种迁移... 阿里巴巴编码规范(Java)考试地 ...

  9. 《编写可维护的 Javascript》读书笔记(附录 A 部分):Javascript 编码风格指南(1)原始值

    记录一下比较有用的编码规范(该指南是基于 Java 语言编码规范和 Javascript 编程规范,同时结合作者 Nicholos Zakas 的个人经验和喜好). 一些关于格式(包括缩进.行的长度. ...

随机推荐

  1. 微博mid和id转换

    mid为62进制编码,id为常见的10进制编码. id从低位到高位,7个数字为一组,转换为62进制,并顺序合并,即转换为mid. mid从地位到高位,4个字母为一组,转换为10进制,并右移7位,计算和 ...

  2. mysql_索引原理及优化

    思考: 我们知道mysql最好的数据存储量级是百万级别,是的往往在百万级别或者几十万级别就会出现慢查询(我对慢查询的定义是大于1秒),几年前我所在的一个做pos机支付的联机交易的核心系统组,当时就做过 ...

  3. Sony Z1 flashtool 刷机笔记

    第一次硬刷,(相较于recovery的卡刷)差点变成无限重启..记录一些关键步骤: 1 unlock bootloader http://developer.sonymobile.com/unlock ...

  4. Android Unable to instantiate activity: Didn't find class on path

    Android Unable to instantiate activity: Didn't find class on path After i spend a while on this prob ...

  5. bzoj2523 聪明的学生

    bzoj第一题,ctsc2001. 黑书上的递归例题,我们定义time()函数,递归求解即可. 这个题用到了一个小技巧:可以使用枚举来搞算法. #include <iostream> #i ...

  6. ThinkPHP数据库访问CRUD;__SELF__和__ACTION__的区别;自动收集表单:$n->create();

    一.tp框架数据访问(pdo基础) public function test() { $n = D("Nation"); //select();find(); //查询 1.$at ...

  7. 简易版C语言程序设计语法

    源程序 → 外部声明 | 子程序(外部声明) 外部声明   → 函数定义| 函数声明 函数定义 → 类型标识符(复合句) 标识符类型 → 无类型 | 字符型 | 整型 | 浮点型 整型→ 长整型 | ...

  8. DataTable/集合 转 Json

    前端用的jqueryUI框架获取json格式数据绑定显示表格. 后端通过WebService获取的数据是DataTable. 现将获取DataTable转Json,也支持将数据集合转Json. 一.项 ...

  9. 转:MVC 数据验证

    一.基础特性 一.Required 必填选项,当提交的表单缺少该值就引发验证错误. 二.StringLength 指定允许的长度 指定最大长度: [StringLength()] //最大长度不超过2 ...

  10. Vimium使用快捷键总结

    chrome 快捷键: ctrl+w 关闭当前标签  ctrl+t 新建标签 gg行首 shift+g 行尾 Vimium使用快捷键总结 j, <c-e> : Scroll down k, ...