一.基本格式

缩进

建议每级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 代码风格指南的更多相关文章

  1. Google JavaScript代码风格指南

    Google JavaScript代码风格指南 修正版本 2.28 Aaron Whyte Bob Jervis Dan Pupius Eric Arvidsson Fritz Schneider R ...

  2. 《Google 代码风格指南》

    <Google 代码风格指南> https://github.com/google/styleguide

  3. python的PEP8 代码风格指南

    PEP8 代码风格指南 这篇文章原文实际上来自于这里:https://www.python.org/dev/peps/pep-0008/ 知识点 代码排版 字符串引号 表达式和语句中的空格 注释 版本 ...

  4. C++代码风格指南总结

    C++代码风格指南 代码风格的重要性 今天我收到thougthwork笔试没过的消息, 心里确实很难受, 然后师兄说我代码写得很糟糕 细想一下, 我写代码确实是随心所欲, 并没有遵循什么规范; 所以现 ...

  5. 大神的JS代码风格指南

    js代码风格指南:1.缩进使用空格,不要用制表符2.必须用分号3.暂时不用ES6(modules)例如export和import命令4.不鼓励(不禁止)水平对齐5.少用var 都应该使用const或者 ...

  6. 读 Angular 代码风格指南

    读 Angular 代码风格指南 本文写于 2021 年 1 月 17 日 原文地址:Angular 文档 该文章拥有完整的代码风格指南--大到如何编排文件夹,小到如何进行变量命名都涉及.但是与 ng ...

  7. JavaScript编码风格指南(中文版)

    前言: 程序语言的编码风格对于一个长期维护的软件非常重要,特别是在团队协作中.如果一个团队使用统一规范的编码分风格,可以提高团队的协作水平和工作效率.编程风格指南的核心是基本的格式化规则,这些规则决定 ...

  8. Google代码风格指南

    官网:https://github.com/google/styleguide 中文版:https://github.com/zh-google-styleguide/zh-google-styleg ...

  9. Google HTML/CSS代码风格指南(中文版)

    原文链接:http://wncbl.cn/posts/c8e10815/ 看一下没什么印象,那就写一遍吧. 背景 本文档定义了HTML/CSS的编写格式和风格规则.它旨在提高合作和代码质量,并使其支持 ...

随机推荐

  1. 输入url到页面返回的过程

    输入url后,你看到了百度的首页,那么这一切是如何发生的呢? 这个问题之前.最近.我想以后肯定还会被问到,或者问到这样的题目,如果在百度框里输入查询的字符串开始,是怎么返回你需要的东西呢. 那这什么个 ...

  2. AC日记——校门外的树 洛谷 P1047

    题目描述 某校大门外长度为L的马路上有一排树,每两棵相邻的树之间的间隔都是1米.我们可以把马路看成一个数轴,马路的一端在数轴0的位置,另一端在L的位置:数轴上的每个整数点,即0,1,2,……,L,都种 ...

  3. PHP实现多图片上传

    PHP实现多图片上传 今天在工作中遇到了一个需求:一个表单实现多个上传图片,类似于QQ空间上传照片的模式.即:可以一次性上传多个图片,但是封面图片只有一个. 最先,最重要的事,在服务器上对文件进行读写 ...

  4. Recover data from reference electrode via EEGLab 用EEGLab恢复参考电极数据

    The data of scanning reference electrode will not show initially. Here is a summary of recovering it ...

  5. Linux 进程间通讯详解三

    msgctl()函数 int msgctl(int msqid, int cmd, struct msqid_ds *buf); --参数 msqid:有msgget函数返回的消息队列标识码 cmd: ...

  6. C# Memcache分布式缓存简单入门

    什么是Memcache?能做什么? 以下是百度的观点: memcache是一套分布式的高速缓存系统,由LiveJournal的Brad Fitzpatrick开发,但目前被许多网站使用以提升网站的访问 ...

  7. 【原创】O2O,你真的知道怎么玩吗?

    自从2011年8月份,O2O的概念被Alex Rampell提出,并且在当年的11月份被引入中国以来,O2O这一概念就好像给久无新意的中国互联网行业,打了一针兴奋剂.O2O这个词也如麦当劳,星巴克这些 ...

  8. [Google Guava]字符串处理:连接器、拆分器、字符匹配器

    一.连接器[Joiner] 二.拆分器[Splitter] 三.字符匹配器[CharMatcher] 四.字符集[Charsets] Charsets:针对所有Java平台都要保证支持的六种字符集提供 ...

  9. java-map和object装换

    /** * 使用org.apache.commons.beanutils进行转换 */ class A { public static Object mapToObject(Map<String ...

  10. Java中使用Jedis操作Redis(转载)

    整理 1.字符串 添加:set keyname value 查询:get keyname 拼接:append keyname value 删除:del keyname 添加多个: mset keyna ...