JS代码自动排版工具是一个帮助程序源来规范代码的实用工具,这样子写出的程序源代码更加美观,也方便之后查看。
我们都知道javascript使用function来管理自己的作用域,一个定义在函数内的变量对外是不可见的,这有点类似于其它语言里的私有变量。对于javascript的执行环境来说一般都有一个全局变量,在所有的函数外可以用this来指引,例如在浏览器端是window。但是当过多的在全局执行环境下定义变量会造成各种苦逼的事情,比方说你定义的变量被其他人定义的同名变量覆盖掉,或者你未来定义的变量把你过去定义的同名变量也覆盖掉,而且过多的全局变量放在执行对战里还会造成内存的浪费等等不优化的情况发生。
js代码编写规范
1.嵌入规则
Javascript程序应该尽量放在.js的文件中,需要调用的时候在页面中以<script src="filename.js">的形式包含进来。Javascript代码若不是该页面专用的,则应尽量避免在页面中直接编写Javascript代码。
2.对齐缩进与换行
a) 缩进
在同一系统中应采用同一种缩进标准,本文提倡缩进大小为4个空格。各编译器对Tab键所代替的空白大小定义不同。建议在设置开发环境时,将编辑器里的Tab快捷键重新设置成4个空格。多数编译器提供了此功能。否则建议按4次空格来进行缩进。
b) 换行
在以下位置必须换行:
每个独立语句结束后;
if、else、catch、finally、while等关键字前;
运算符处换行时,运算符必须在新行的行首。
对于因为单行长度超过限制时产生的换行,参考行长度中的策略进行分隔。
1).字符串过长截断
每行代码应小于80个字符。若代码较长应尽量换行,换行应选择在操作符和标点符号之后,最好是在分号“;”或逗号“,”之后。下一行代码相对上一行缩进4个空格。这样可以有效防止复制粘贴引起的代码缺失等错误并增强可读性。
按一定长度截断字符串,并使用+运算符进行连接。分隔字符串尽量按语义进行,如不要在一个完整的名词中间断开。特别的,对于HTML片段的拼接,通过缩进,保持和HTML相同的结构:
也可使用数组来进行拼接,相对+运算更容易调整缩进:
2).三元运算符过长
三元运算符由3部分组成,因此其换行应当根据每个部分的长度不同,形成3种不同的情况:
不得出现以下情况:
3).过长的逻辑条件组合
当因为较复杂的逻辑条件组合导致80个字符无法满足需求时,应当将每个条件独立一行,逻辑运算符放置在行首进行分隔,或将部分逻辑按逻辑组合进行分隔。最终将右括号)与左大括号{放在独立一行,保证与if内语句块能容易视觉辨识。如:
4).过长的JSON和数组
如果对象属性较多导致每个属性一行占用空间过大,可以按语义或逻辑进行分组的组织,如:
通过5个一组的分组,将每一行控制在合理的范围内,并且按逻辑进行了切分。 对于项目较多的数组,也可以采用相同的方法,如:
- PC官方版
- 安卓官方手机版
- IOS官方手机版