现如今最流行的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 相关文章推荐
ASP中进行HTML数据及JS数据编码函数
Nov 11 Javascript
js中confirm实现执行操作前弹出确认框的方法
Nov 01 Javascript
SWFObject基本用法实例分析
Jul 20 Javascript
JS实现的不规则TAB选项卡效果代码
Sep 18 Javascript
使用JS正则表达式 替换括号,尖括号等
Nov 29 Javascript
Bootstrap入门教程一Hello Bootstrap初识
Mar 02 Javascript
vue 数组和对象不能直接赋值情况和解决方法(推荐)
Oct 25 Javascript
仿京东快报向上滚动的实例
Dec 13 Javascript
4个顶级开源JavaScript图表库
Sep 29 Javascript
vue实现鼠标移入移出事件代码实例
Mar 27 Javascript
微信小程序wx.navigateTo方法里的events参数使用详情及场景
Jan 07 Javascript
vue实现标签云效果的示例
Nov 09 Javascript
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
php文章内容分页并生成相应的htm静态页面代码
2010/06/07 PHP
PHP生成不重复标识符的方法
2014/11/21 PHP
JS启动应用程序的一个简单例子
2008/05/11 Javascript
node.js使用npm 安装插件时提示install Error: ENOENT报错的解决方法
2014/11/20 Javascript
JS实现从顶部下拉显示的带动画QQ客服特效代码
2015/10/24 Javascript
超实用的javascript时间处理总结
2016/08/16 Javascript
AngularJS应用开发思维之依赖注入3
2016/08/19 Javascript
Nodejs进阶:核心模块net入门学习与实例讲解
2016/11/21 NodeJs
fckeditor部署到weblogic出现xml无法读取及样式不能显示问题的解决方法
2017/03/24 Javascript
详解Vue2.0之去掉组件click事件的native修饰
2017/04/20 Javascript
angularJS模态框$modal实例代码
2017/05/27 Javascript
jQuery DOM节点的遍历方法小结
2017/08/15 jQuery
vue vuex vue-rouert后台项目——权限路由(适合初学)
2017/12/29 Javascript
JavaScript设计模式之单例模式简单实例教程
2018/07/02 Javascript
vue element 生成无线级左侧菜单的实现代码
2019/08/21 Javascript
JS实现简易图片自动轮播
2020/10/16 Javascript
JS指定音频audio在某个时间点进行播放
2020/11/28 Javascript
Python分析学校四六级过关情况
2017/11/22 Python
Python中Threading用法详解
2017/12/27 Python
Python去除字符串前后空格的几种方法
2019/03/04 Python
Pandas DataFrame数据的更改、插入新增的列和行的方法
2019/06/25 Python
python如何从键盘获取输入实例
2020/06/18 Python
如何把python项目部署到linux服务器
2020/08/26 Python
Python基于staticmethod装饰器标示静态方法
2020/10/17 Python
css3简单练习实现遨游浏览器logo的绘制
2013/01/30 HTML / CSS
猫途鹰:全球领先的旅游点评社区
2017/04/07 全球购物
英国奢侈品在线精品店:Hervia
2020/09/03 全球购物
描述一下JVM加载class文件的原理机制
2013/12/08 面试题
事业单位请假制度
2014/01/13 职场文书
保安队长职务说明书
2014/02/23 职场文书
房屋买卖委托公证书
2014/04/08 职场文书
建筑安全标语
2014/06/07 职场文书
改革共识倡议书
2014/08/29 职场文书
查摆问题整改措施范文
2014/10/11 职场文书
项目战略合作意向书
2015/05/08 职场文书
2016新教师培训心得体会范文
2016/01/08 职场文书