JavaScript 代码风格指南
一.基本格式
缩进
建议每级4个空格,可以给编辑器设置tab = 4个空格,自动转换
分号
不要省略分号,防止ASI(自动插入分号)错误
行宽
每行代码不超过80个字符,过长应该用操作符手动断行
断行
操作符在上一行末尾,且下一行缩进2级,如果是赋值语句,还应该和等号后面部分对齐
空行
函数声明与函数声明、变量声明与函数声明、函数内部的逻辑块之间都应该有空行隔开
作者尼古拉斯还建议在流程控制块顶部留一个空行,但给的例子不是很明确
命名
- 变量名/函数名:Camel(驼峰)规则,首词首字母小写,后续词首字母大写,其余部分小写
- 常量名:C语言式,全大写,下划线分词
- 构造函数:Pascal规则,所有词首字母大写,其余部分小写
字面量
- 字符串:双引号包裹,断行用[+]操作符,不要用\转义字符
- 数值:不要省略小数点前后的部分,不要用八进制形式
- Null:只把null当作Object的占位符,不要用来检测形参,也不要用来检测未初始化的变量
- Undefined:应该把所有对象都初始化为null,以区分未定义和未初始化
- 对象字面量/数组字面量:不要用构造函数方式声明对象和数组
二.注释
P.S.书中有一句非常经典的解释:
Appropriately written comments help tell the story of code, allowing other developers to drop into a part of the story without needing to hear the beginning.
单行注释
- 行尾:用1级缩进隔开代码,而且//后面要有一个空格
- 独占一行:用来注释下面,要与被注释的代码保持相同的缩进
- 行首:用来注释多行代码
多行注释
用来包裹大段注释,推荐Eclipse风格,例如
/*
* comment line1
* comment line2
*/
注意:
- 多行注释上方留一个空行
- *星号后面留一个空格
- 多行注释至少三行(因为第一行和最后一行后面不加注释)
在哪里添注释
- 不能自解释的代码
- 故意的,但看起来像是有错的地方
- 针对浏览器的hack
文档注释
应该给各个函数添注释,包括功能描述、参数、返回值、抛出的错误等等,例如推荐的Eclipse风格:
/**
* 添加指定元素到默认数组
*
* @method add
* @param {Number} 将要添加的元素
* @return {Boolean} 添加成功/失败
* @throw {TypeError} 参数类型不匹配
*/
function add(item){
if(typeof item === "number"){
arr.push(item)
}
else{
throw new TypeError();
}
}
三.语句和表达式
花括号对齐方式
建议行尾风格,不推荐次行风格
块语句空格
if后的圆括号部分前后各有一个空格,例如:
if (expr) {
code
}
switch语句
- 缩进:case与switch对齐,break缩进1级
- case贯穿:用空行或注释//falls through表明case贯穿是故意的
- default:保留default或者用注释//no default表明没有default
P.S.《JavaScript语言精粹》的作者道格拉斯认为不应该用case贯穿(称之为鸡肋),因为极易引发bug,而尼古拉斯认为用空行或者注释说明就好了
with语句
不用
for循环
所有变量都应该在函数体顶部声明,包括for循环初始化部分用到的变量,避免hosting(提升)引发bug(可能会屏蔽全局变量)
for-in循环
不要用来遍历数组,用的时候记得加上hasOwnProperty过滤,如果故意遍历原型属性,应该用注释说明
四.变量、函数、操作符
变量声明
函数体 = 变量声明 + 函数声明 + 逻辑语句。用空行隔开各个部分
函数声明
先声明再使用,千万不要把函数声明放在if分支里,因为浏览器理解不同,而且ES没给标准
函数调用
圆括号前后都不加空格,避免和块语句混淆
匿名函数立即执行
把立即执行的匿名函数用圆括号包裹,避免与匿名函数声明混淆
严格模式
不要在全局作用域开严格模式,只在函数内部开,给多个函数开可以用匿名函数立即执行限定严格模式的作用域
判断等于
只用===和!==
eval
不用eval()和new Function(),用匿名函数优化setTimeout()和setInterval()
基本包装类型
不要用new Boolean(), new String(), new Number()
JavaScript 代码风格指南的更多相关文章
- Google JavaScript代码风格指南
Google JavaScript代码风格指南 修正版本 2.28 Aaron Whyte Bob Jervis Dan Pupius Eric Arvidsson Fritz Schneider R ...
- 《Google 代码风格指南》
<Google 代码风格指南> https://github.com/google/styleguide
- python的PEP8 代码风格指南
PEP8 代码风格指南 这篇文章原文实际上来自于这里:https://www.python.org/dev/peps/pep-0008/ 知识点 代码排版 字符串引号 表达式和语句中的空格 注释 版本 ...
- C++代码风格指南总结
C++代码风格指南 代码风格的重要性 今天我收到thougthwork笔试没过的消息, 心里确实很难受, 然后师兄说我代码写得很糟糕 细想一下, 我写代码确实是随心所欲, 并没有遵循什么规范; 所以现 ...
- 大神的JS代码风格指南
js代码风格指南:1.缩进使用空格,不要用制表符2.必须用分号3.暂时不用ES6(modules)例如export和import命令4.不鼓励(不禁止)水平对齐5.少用var 都应该使用const或者 ...
- 读 Angular 代码风格指南
读 Angular 代码风格指南 本文写于 2021 年 1 月 17 日 原文地址:Angular 文档 该文章拥有完整的代码风格指南--大到如何编排文件夹,小到如何进行变量命名都涉及.但是与 ng ...
- JavaScript编码风格指南(中文版)
前言: 程序语言的编码风格对于一个长期维护的软件非常重要,特别是在团队协作中.如果一个团队使用统一规范的编码分风格,可以提高团队的协作水平和工作效率.编程风格指南的核心是基本的格式化规则,这些规则决定 ...
- Google代码风格指南
官网:https://github.com/google/styleguide 中文版:https://github.com/zh-google-styleguide/zh-google-styleg ...
- Google HTML/CSS代码风格指南(中文版)
原文链接:http://wncbl.cn/posts/c8e10815/ 看一下没什么印象,那就写一遍吧. 背景 本文档定义了HTML/CSS的编写格式和风格规则.它旨在提高合作和代码质量,并使其支持 ...
随机推荐
- 利用Theme自定义Activity间的切换动画
转载请注明出处:http://blog.csdn.net/lmj623565791/article/details/22990643 大多Android系统默认Activity间的动画切换效果为,右边 ...
- 初识CDQ分治
[BZOJ 1176:单点修改,查询子矩阵和]: 1176: [Balkan2007]Mokia Time Limit: 30 Sec Memory Limit: 162 MBSubmit: 200 ...
- Python学习Day2笔记(集合和文件操作)
1.集合的使用 列表是有序的可包含重复内容的 集合是无序的不可包含重复内容的 1) 集合关系测试 #列表去重list_1=[1,4,5,6,7,8,9,7,5,4,23,2] #有重复数据 list_ ...
- CSS基本知识2-CSS选择
选择就是CSS定义的第一部分,可以用面向对象的模式来理解,或者声明式的面向对象. 标准选择: #.E 进阶选择:“,”分隔多个相同项,相当于类的实例. 如:#btn1,#btn2,.btn {...} ...
- HTML5属性--(capture="camera") 上传照片或者打开手机相机
要获取手机相机拍照或者访问相册 这里贴一个相关链接:http://blog.csdn.net/jackfrued/article/details/8967667 JSP页面代码: <inp ...
- Python学习之day2
1.执行Python脚本时打印的字符有颜色 print "\033[32;1mhello\033[0m" #打印绿色 print "\033[31;1mhello\033 ...
- redis-介绍与比较
<一>. NoSQL简介: NoSQL是Not-Only-SQL的缩写,是被设计用来替换传统的关系型数据库在某些领域的用,特别针对web2.0站点以及大型的SNS网站,用来满足高并发 ...
- 构建自己的 Linux 发行版
如何用 SUSE Studio 构建 Linux 发行版? (1) 进入到 www.susestudio.com,设立一个帐户 (2) 为你的设备(发行版)选择一个基本模板 -软件和软件包选择 (1) ...
- BZOJ 2882: 工艺
2882: 工艺 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 599 Solved: 268[Submit][Status][Discuss] D ...
- Java Web的web.xml文件作用及基本配置(转)
其实web.xml就是asp.net的web.config一个道理. 说明: 一个web中完全可以没有web.xml文件,也就是说,web.xml文件并不是web工程必须的. web.xml文件是用来 ...