现如今最流行的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 相关文章推荐
document.all还是document.getElementsByName?
Jul 21 Javascript
ExtJS PropertyGrid中使用Combobox选择值问题
Jun 13 Javascript
JavaScript的arguments对象应用示例
Sep 15 Javascript
工作中比较实用的JavaScript验证和数据处理的干货(经典)
Aug 03 Javascript
原生node.js案例--前后台交互
Feb 20 Javascript
前端框架学习总结之Angular、React与Vue的比较详解
Mar 14 Javascript
浅谈js使用in和hasOwnProperty获取对象属性的区别
Apr 27 Javascript
Angular4自制一个市县二级联动组件示例
Nov 21 Javascript
vue结合axios与后端进行ajax交互的方法
Jul 06 Javascript
Vue中的情侣属性$dispatch和$broadcast详解
Mar 07 Javascript
微信小程序授权登陆及每次检查是否授权实例代码
Sep 18 Javascript
js实现碰撞检测
Jan 29 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
一台收音机,让一家人都笑逐颜开!
2020/08/21 无线电
php类中private属性继承问题分析
2012/11/01 PHP
探讨fckeditor在Php中的配置详解
2013/06/08 PHP
Yii2中多表关联查询hasOne hasMany的方法
2017/02/15 PHP
javascript parseInt 函数分析(转)
2009/03/21 Javascript
关于JavaScript的一些看法
2009/05/27 Javascript
关于window.pageYOffset和document.documentElement.scrollTop
2011/04/05 Javascript
js jquery获取当前元素的兄弟级 上一个 下一个元素
2015/09/01 Javascript
AngularJs学习第八篇 过滤器filter创建
2016/06/08 Javascript
Document.body.scrollTop的值总为零的快速解决办法
2016/06/09 Javascript
AngularJS基础 ng-dblclick 指令用法
2016/08/01 Javascript
关于angular js_$watch监控属性和对象详解
2017/04/24 Javascript
从零开始在NPM上发布一个Vue组件的方法步骤
2018/12/20 Javascript
vue实现移动端省市区选择
2019/09/27 Javascript
[02:51]DOTA2英雄基础教程 艾欧
2014/01/13 DOTA
使用python绘制二元函数图像的实例
2019/02/12 Python
python 读写excel文件操作示例【附源码下载】
2019/06/19 Python
python识别图像并提取文字的实现方法
2019/06/28 Python
如何在Django配置文件里配置session链接
2019/08/06 Python
利用python实现短信和电话提醒功能的例子
2019/08/08 Python
基于MATLAB和Python实现MFCC特征参数提取
2019/08/13 Python
python getpass实现密文实例详解
2019/09/24 Python
python PIL/cv2/base64相互转换实例
2020/01/09 Python
Tensorflow 1.0之后模型文件、权重数值的读取方式
2020/02/12 Python
Django ORM实现按天获取数据去重求和例子
2020/05/18 Python
Python列表如何更新值
2020/05/27 Python
pandas DataFrame运算的实现
2020/06/14 Python
3分钟看懂Python后端必须知道的Django的信号机制
2020/07/26 Python
Zalando Lounge瑞士:时尚与生活方式购物俱乐部
2020/03/12 全球购物
婚礼新郎父母答谢词
2014/01/16 职场文书
2014年母亲节演讲稿范文
2014/05/07 职场文书
乡镇党的群众路线教育实践活动剖析材料
2014/10/09 职场文书
群众对十八届四中全会的期盼
2014/10/17 职场文书
增值税发票丢失证明
2015/06/19 职场文书
Nginx 过滤静态资源文件的访问日志的实现
2021/03/31 Servers
用golang如何替换某个文件中的字符串
2021/04/25 Golang