现如今最流行的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 相关文章推荐
JavaScript 对Cookie 操作的封装小结
Dec 31 Javascript
appendChild() 或 insertBefore()使用与区别介绍
Oct 11 Javascript
Javascript 按位左移运算符使用介绍(
Feb 04 Javascript
JavaScript的strict模式与with关键字介绍
Feb 08 Javascript
angularjs学习笔记之三大模块(modal,controller,view)
Sep 26 Javascript
jQuery封装的屏幕居中提示信息代码
Jun 08 Javascript
JS根据生日月份和日期计算星座的简单实现方法
Nov 24 Javascript
微信小程序 下拉列表的实现实例代码
Mar 08 Javascript
Angular 2 ngForm中的ngModel、[ngModel]和[(ngModel)]的写法
Jun 29 Javascript
深入理解react 组件类型及使用场景
Mar 07 Javascript
vue-cli webpack配置文件分析
May 20 Javascript
分享一个vue实现的记事本功能案例
Apr 11 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
玩转图像函数库―常见图形操作
2006/09/03 PHP
PHP 服务器配置(使用Apache及IIS两种方法)
2009/06/01 PHP
PHPEXCEL 使用小记
2013/01/06 PHP
php简单实现快速排序的方法
2015/04/04 PHP
PHP判断字符串长度的两种方法很实用
2015/09/22 PHP
php实现的递归提成方案实例
2015/11/14 PHP
一键生成各种尺寸Icon的php脚本(实例)
2017/02/08 PHP
ThinkPHP整合datatables实现服务端分页的示例代码
2018/02/10 PHP
PDO::inTransaction讲解
2019/01/28 PHP
PHP+mysql防止SQL注入的方法小结
2019/04/27 PHP
JScript分割字符串示例代码
2013/09/04 Javascript
javascript创建createXmlHttpRequest对象示例代码
2014/02/10 Javascript
EasyUi中的Combogrid 实现分页和动态搜索远程数据
2016/04/01 Javascript
瀑布流的实现方式(原生js+jquery+css3)
2020/06/28 Javascript
分享JS数组求和与求最大值的方法
2016/08/11 Javascript
xmlplus组件设计系列之按钮(2)
2017/04/26 Javascript
js学习心得_一个简单的动画库封装tween.js
2017/07/14 Javascript
JQuery元素快速查找与操作
2018/04/22 jQuery
公众号SVG动画交互实战代码
2020/05/31 Javascript
[10:21]2018DOTA2国际邀请赛寻真——Winstrike
2018/08/11 DOTA
[01:23]2019完美世界全国高校联赛(春季赛)合肥全国总决赛
2019/06/10 DOTA
python发送arp欺骗攻击代码分析
2014/01/16 Python
sqlalchemy对象转dict的示例
2014/04/22 Python
python之Character string(实例讲解)
2017/09/25 Python
Django项目开发中cookies和session的常用操作分析
2018/07/03 Python
详解django+django-celery+celery的整合实战
2019/03/19 Python
Python实现鼠标自动在屏幕上随机移动功能
2020/03/14 Python
使用Python和百度语音识别生成视频字幕的实现
2020/04/09 Python
Python 中 sorted 如何自定义比较逻辑
2021/02/02 Python
工作中的自我评价如何写好
2013/10/28 职场文书
业务主管岗位职责
2013/11/20 职场文书
初婚初育证明
2014/01/14 职场文书
大学生求职自荐信范文
2015/03/04 职场文书
老乡聚会通知
2015/04/23 职场文书
Go语言应该什么情况使用指针
2021/07/25 Golang
MySQ InnoDB和MyISAM存储引擎介绍
2022/04/26 MySQL