现如今最流行的JavaScript代码规范


Posted in Javascript onMarch 08, 2014

什么是最佳的JavaScript代码编程规范?这可能是一个众口难调的问题。那么,不妨换个问题,什么代码规范最流行?

sideeffect.kr通过分析GitHub上托管的开源代码,得出了一些有趣的结果。一起来看看吧。

现如今最流行的JavaScript代码规范

行末逗号对行首逗号
行末引号:

var foo = 1, 
    bar = 2, 
    baz = 3; var obj = { 
    foo: 1, 
    bar: 2, 
    baz: 3 
};

行首引号:
var foo = 1 
  , bar = 2 
  , baz = 3; var obj = { 
    foo: 1 
  , bar: 2 
  , baz: 3 
};

行末,92.345%;行首,7.655%。(基于1,100,251次提交统计。)

空格和Tab
这年头大家都爱用空格了。使用空格缩进可以保证不同的开发者、不同的编辑器设置下看到的结果是一样的。

空格,81.1 %;Tab,18.9 %。(基于2,019,550次提交统计。)

函数后是否添加空格
无空格

function foo() { 
  return "bar"; 
}

有空格
function foo () { 
  return "bar"; 
}

无空格,67.424 %;有空格,32.576 %。(基于1,212,488次提交统计。)

参数与括号间是否有空格
无空格

function fn(arg1, arg2) { 
//or 
if (true) {

有空格
function fn( arg1, arg2 ) { 
  // ... 
} if ( true ) { 
  // ... 
}

无空格,94.31 %;有空格,5.69 %。(基于1,514,971次提交统计。)

对象字面量中冒号周围是否有空格
冒号后有空格

{ 
  foo: 1, 
  bar: 2, 
  baz: 3 
}

冒号后无空格
{ 
  foo:1, 
  bar:2, 
  baz:3 
}

冒号前后均有空格
{ 
  foo : 1, 
  bar : 2, 
  baz : 3 
}

后空格,62.955 %;无空格,22.891 %;前后空格,14.154 %。(基于1,300,035次提交统计。)

个人觉得,无空格太挤了,不利于快速分清key和value。前后空格的话,恐怕需要对齐冒号,看起来才美观,从统计数据来看,大部分程序员懒得对齐冒号(还是说,大部分程序员的IDE或编辑器不够智能?)

条件语句
有空格

if (true) { 
  //... 
} while (true) { 
  //... 
} 
switch (v) { 
  //... 
}

无空格
if(true) { 
  //... 
} while(true) { 
  //... 
} 
switch(v) { 
  //... 
}

有空格,78.276 %;无空格,21.724 %。(基于1,163,316次提交。)

单引号、双引号
单引号,56.791 %;双引号,43.209 %。(基于1,705,910次提交。)

总结
所以说,最流行的代码规范是:

•行末逗号
•空格缩进
•函数名称后无空格
•函数参数与括号间无空格
•对象字面量的冒号后加空格,冒号前不加
•条件语句关键字后加空格

流行的不一定是好的(比如流行性感冒),但是从交流的角度来说,按照流行的风格编写代码,可以让你的代码在大多数人看起来更习惯。

Javascript 相关文章推荐
js实现点击按钮后给Div图层设置随机背景颜色的方法
May 06 Javascript
简单谈谈javascript Date类型
Sep 06 Javascript
Bootstrap每天必学之表单
Nov 23 Javascript
Jquery EasyUI实现treegrid上显示checkbox并取选定值的方法
Apr 29 Javascript
Avalon中文长字符截取、关键字符隐藏、自定义过滤器
May 18 Javascript
JQuery 传送中文乱码问题的简单解决办法
May 24 Javascript
Javascript中click与blur事件的顺序详析
Apr 25 Javascript
iframe高度自适应及隐藏滚动条的实例详解
Sep 29 Javascript
JS实现带导航城市列表以及输入搜索功能
Jan 04 Javascript
Bootstrap table表格初始化表格数据的方法
Jul 25 Javascript
深入浅析var,let,const的异同点
Aug 07 Javascript
js和jquery判断数据类型的4种方法总结
Aug 28 jQuery
Jquery实现点击按钮,连续地向textarea中添加值的实例代码
Mar 08 #Javascript
js中的onchange和onpropertychange (onchange无效的解决方法)
Mar 08 #Javascript
JS实现鼠标单击与双击事件共存
Mar 08 #Javascript
js触发onchange事件的方法说明
Mar 08 #Javascript
关于onchange事件在IE和FF下的表现及解决方法
Mar 08 #Javascript
javascript中的事件代理初探
Mar 08 #Javascript
jquery实现弹出div,始终显示在屏幕正中间的简单实例
Mar 08 #Javascript
You might like
执行、获取远程代码返回:file_get_contents 超时处理的问题详解
2013/06/25 PHP
php利用单例模式实现日志处理类库
2014/02/10 PHP
PHP+Redis开发的书签案例实战详解
2019/07/09 PHP
PHP切割整数工具类似微信红包金额分配的思路详解
2019/09/18 PHP
laravel 5.5 关闭token的3种实现方式
2019/10/24 PHP
不同Jquery版本引发的问题解决
2013/10/14 Javascript
JavaScript Math.ceil() 函数使用介绍
2013/12/11 Javascript
js实现的标题栏新消息闪烁提示效果
2014/06/06 Javascript
js生成的验证码的实现与技术分析
2014/09/17 Javascript
基于jQuery实现的QQ表情插件
2015/08/25 Javascript
AngualrJS中的Directive制作一个菜单
2016/01/26 Javascript
javascript深拷贝(deepClone)详解
2016/08/24 Javascript
jQuery 利用$.ajax 时获取原生XMLHttpRequest 对象的方法
2016/08/25 Javascript
BootStrapValidator校验方式
2016/12/19 Javascript
js控制一个按钮是否可点击(可使用)disabled的实例
2017/02/14 Javascript
JavaScript中一些特殊的字符运算
2017/08/17 Javascript
微信小程序返回上一页传参并刷新过程解析
2019/12/13 Javascript
Vue组件化开发之通用型弹出框的实现
2020/02/28 Javascript
Vue 防止短时间内连续点击后多次触发请求的操作
2020/11/11 Javascript
[48:30]LGD vs infamous Supermajor小组赛D组 BO3 第一场 6.3
2018/06/04 DOTA
Python聚类算法之DBSACN实例分析
2015/11/20 Python
对Python3中的input函数详解
2018/04/22 Python
Python 利用scrapy爬虫通过短短50行代码下载整站短视频
2018/10/29 Python
Python提取PDF内容的方法(文本、图像、线条等)
2019/09/25 Python
keras实现VGG16 CIFAR10数据集方式
2020/07/07 Python
英国领先的品牌珠宝和配件供应商:Acotis Jewellery
2018/03/07 全球购物
美国五金商店:Ace Hardware
2018/03/27 全球购物
Ted Baker美国官网:英国时尚品牌
2018/10/29 全球购物
eBay荷兰购物网站:eBay.nl
2020/06/26 全球购物
学前教育专业毕业生自荐信
2013/10/03 职场文书
外贸英语毕业生自荐信
2013/11/14 职场文书
传承焦裕禄精神思想汇报2014
2014/09/10 职场文书
MySQL中datetime时间字段的四舍五入操作
2021/10/05 MySQL
JavaScript 中for/of,for/in 的详细介绍
2021/11/17 Javascript
Pycharm远程调试和MySQL数据库授权问题
2022/03/18 MySQL
Java 获取Word中所有的插入和删除修订的方法
2022/04/06 Java/Android