现如今最流行的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 相关文章推荐
JQuery表单验证插件EasyValidator用法分析
Nov 15 Javascript
jquery实现动态操作select选中
Feb 11 Javascript
JS原型链怎么理解
Jun 27 Javascript
js基本算法:冒泡排序,二分查找的简单实例
Oct 08 Javascript
详解Vue.js动态绑定class
Dec 20 Javascript
Bootstrap 填充Json数据的实例代码
Jan 11 Javascript
js实现密码强度检验
Jan 15 Javascript
js制作简单的音乐播放器的示例代码
Aug 28 Javascript
AngularJs的UI组件ui-Bootstrap之Tooltip和Popover
Jul 13 Javascript
如何从零开始手写Koa2框架
Mar 22 Javascript
js实现弹出框的拖拽效果实例代码详解
Apr 16 Javascript
JavaScript eval()函数定义及使用方法详解
Jul 07 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 变量定义和变量替换的方法
2009/07/30 PHP
PHP实现手机号码中间四位用星号(*)隐藏的自定义函数分享
2014/09/27 PHP
PHP使用Memcache时模拟命名空间及缓存失效问题的解决
2016/02/27 PHP
PHP实现的字符串匹配算法示例【sunday算法】
2017/12/19 PHP
网络图片延迟加载实现代码 超越jquery控件
2010/03/27 Javascript
12款经典的白富美型—jquery图片轮播插件—前端开发必备
2013/01/08 Javascript
通过js来制作复选框的全选和不选效果
2014/05/22 Javascript
AspNet中使用JQuery上传插件Uploadify详解
2015/05/20 Javascript
JavaScript文本框脚本编写的注意事项
2016/01/25 Javascript
Javascript中prototype的使用详解
2016/06/18 Javascript
jQuery之简单的表单验证实例
2016/07/07 Javascript
几行js代码实现自适应
2017/02/24 Javascript
JS正则表达式判断有效数实例代码
2017/03/13 Javascript
Angular 1.x个人使用的经验小结
2017/07/19 Javascript
通过一个简单的例子学会vuex与模块化
2017/11/22 Javascript
基于dataset的使用和图片延时加载的实现方法
2017/12/11 Javascript
小程序云开发初探(小结)
2018/10/24 Javascript
基于layui实现高级搜索(筛选)功能
2019/07/26 Javascript
JS实现随机抽取三人
2019/11/06 Javascript
Vue中import from的来源及省略后缀与加载文件夹问题
2020/02/09 Javascript
vue 授权获取微信openId操作
2020/11/13 Javascript
python采集博客中上传的QQ截图文件
2014/07/18 Python
python基础教程之面向对象的一些概念
2014/08/29 Python
Python多维/嵌套字典数据无限遍历的实现
2016/11/04 Python
python实现求解列表中元素的排列和组合问题
2018/03/15 Python
django数据关系一对多、多对多模型、自关联的建立
2019/07/24 Python
Django admin model 汉化显示文字的实现方法
2019/08/12 Python
python 使用cx-freeze打包程序的实现
2020/03/14 Python
python按顺序重命名文件并分类转移到各个文件夹中的实现代码
2020/07/21 Python
生日主持词
2014/03/20 职场文书
基层党员群众路线教育实践活动个人对照检查材料思想汇报
2014/10/05 职场文书
中学生逃课检讨书
2015/02/17 职场文书
2015年小学教科研工作总结
2015/07/20 职场文书
Python 数据可视化之Matplotlib详解
2021/11/02 Python
nginx配置限速限流基于内置模块
2022/05/02 Servers