现如今最流行的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 弹出登录窗口实现代码
Dec 24 Javascript
js实现拖拽 闭包函数详细介绍
Nov 25 Javascript
offsetHeight在OnLoad中获取为0的现象
Jul 22 Javascript
JqueryMobile动态生成listView并实现刷新的两种方法
Mar 05 Javascript
javascript动态添加删除tabs标签的方法
Jul 06 Javascript
AngularJS动态加载模块和依赖的方法分析
Nov 08 Javascript
微信小程序 动态绑定数据及动态事件处理
Mar 14 Javascript
实时监控input框,实现输入框与下拉框联动的实例
Jan 23 Javascript
基于vue2的canvas时钟倒计时组件步骤解析
Nov 05 Javascript
深入Node TCP模块的理解
Mar 13 Javascript
JS异步错误捕获的一些事小结
Apr 26 Javascript
vue中音频wavesurfer.js的使用方法
Feb 20 Vue.js
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
Views rows style模板重写代码
2011/05/16 PHP
php阻止页面后退的方法分享
2014/02/17 PHP
php header函数的常用http头设置
2015/06/25 PHP
PHP伪造来源HTTP_REFERER的方法实例详解
2015/07/06 PHP
php根据地址获取百度地图经纬度的实例方法
2019/09/03 PHP
对laravel in 查询的使用方法详解
2019/10/09 PHP
基于PHP实现解密或加密Cloudflar邮箱保护
2020/06/24 PHP
jQuery 各种浏览器下获得日期区别
2008/12/22 Javascript
理运用命名空间让js不产生冲突避免全局变量的泛滥
2014/06/15 Javascript
限制上传文件大小和格式的jQuery插件实例
2015/01/24 Javascript
nodejs socket服务端和客户端简单通信功能
2017/09/14 NodeJs
判断div滑动到底部的scroll实例代码
2017/11/15 Javascript
基于cropper.js封装vue实现在线图片裁剪组件功能
2018/03/01 Javascript
Python实现把数字转换成中文
2015/06/29 Python
python 使用get_argument获取url query参数
2017/04/28 Python
详解Python之unittest单元测试代码
2018/01/24 Python
python实现二级登陆菜单及安装过程
2019/06/21 Python
代码实例讲解python3的编码问题
2019/07/08 Python
Python-copy()与deepcopy()区别详解
2019/07/12 Python
对Django中static(静态)文件详解以及{% static %}标签的使用方法
2019/07/28 Python
基于python实现雪花算法过程详解
2019/11/16 Python
Python爬虫自动化爬取b站实时弹幕实例方法
2021/01/26 Python
Html5页面获取微信公众号的openid的方法
2020/05/12 HTML / CSS
日本最大的眼镜购物网站:Oh My Glasses
2016/11/13 全球购物
含精油的天然有机化妆品:Indemne
2019/08/27 全球购物
海蓝之谜英国官网:La Mer英国
2020/01/15 全球购物
医药工作岗位求职信分享
2013/12/31 职场文书
2014年党员创先争优承诺书
2014/05/29 职场文书
经营理念口号
2014/06/21 职场文书
房屋维修协议书范本
2014/09/25 职场文书
酒店前台岗位职责
2015/04/16 职场文书
消费者投诉书范文
2015/07/02 职场文书
2016年教师节感言
2015/12/09 职场文书
责任书格式
2019/04/18 职场文书
员工工作心得体会
2019/05/07 职场文书
Win11 25163.1010更新补丁KB5016904推送,测试服务验证管道(附更新修复汇总)
2022/07/23 数码科技