说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

一些达成共识的JavaScript编码风格约定

HTML文档下载 WORD文档下载 PDF文档下载
如果项目中有多名开发者,一个有共识的编码风格约定就显得非常有必要了。目前JavaScript还没有一个权威的、统一的编码风格指南,取而代之的是一些大公司和项目的风格约定。本文就来探讨这些约定中哪些已经达成共识。

如果你的代码易于阅读,那么代码中bug也将会很少,因为一些bug可以很容被调试,并且,其他开发者参与你项目时的门槛也会比较低。因此,如果项目中有多人参与,采取一个有共识的编码风格约定非常有必要。与其他一些语言相比(比如Python示例),JavaScript没有一个权威的编码风格指南,取而代之的是一些流行的编码风格:

  • Google的JavaScript风格指南(以下简称Google)
  • NPM编码风格(以下简称NPM)
  • Felix的Node.js风格指南(以下简称Node.js)
  • 惯用(Idiomatic)的JavaScript(以下简称Idiomatic)
  • jQuery JavaScript风格指南(以下简称jQuery)
  • Douglas Crockford的JavaScript风格指南(以下简称Crockford),Douglas Crockford是Web开发领域最知名的技术权威之一,ECMA JavaScript 2.0标准化委员会委员

当然,在JavaScript语法检查器JSLint和JSHint中也有一些默认的设置选择。问题是,什么才是终极的、让大多数开发者可以遵循的JavaScript编码风格呢?下面让我们从这6个风格指南中找出一些有共识的风格来。

代码风格

缩进

  • 两个空格,无需更长的缩进,无需Tab缩进:Google、NPM、Node.js、Idiomatic
  • Tab缩进:jQuery
  • 4个空格:Crockford

参数和表达式之间的空格

  • 使用紧凑型风格:Google、NPM、Node.js

project.MyClass = function(arg1, arg2) {

  • 过多地使用空格:Idiomatic, jQuery

for ( i = 0; i < length; i++ ) {

没有发表意见:Crockford

大部分指南中,都提醒开发者不要在语句结尾处有任何的空格。

代码行长度

  • 最多80个字符:Google、NPM、Node.js、Crockford(当在代码块中,除了2个空格外的其他缩进允许将函数参数与首个函数参数的位置对齐。另一种选择是当自动换行时使用4个空格缩进,而不是2个。)
  • 没有发表意见:jQuery、Idiomatic

分号

  • 始终使用分号,不依赖于隐式插入:Google、Node.js、Crockford
  • 在某些情况下不要使用expect:NPM
  • 没有发表意见:jQuery、Idiomatic

注释

  • 遵循JSDoc约定:Google、Idiomatic
  • 没有发表意见:NPM、Node.js、jQuery、Crockford

引号

  • 推荐单引号:Google、Node.js
  • 双引号:jQuery
  • 没有发表意见:NPM、Idiomatic、Crockford

变量声明

  • 一次声明一个,不使用逗号:Node.js

var foo = '';var bar = '';

  • 一次声明多个,在行结束处使用逗号分隔:Idiomatic、jQuery

var foo = "",  bar = "",  quux;

  • 在行开始处使用逗号:NPM
  • 没有发表意见:Google、Crockford

大括号

  • 在同一行使用左大括号:Google、NPM、Node.js、Idiomatic、 jQuery、Crockford

function thisIsBlock(){

NPM指南中指出,只在代码块需要包含下一行时使用大括号,否则不使用。

全局变量

  • 不要使用全局变量:Google、Crockford(谷歌表示,全局变量命名冲突难以调试,并可能在两个项目进行正整合时出现一些棘手的问题。为了便于共享公用的JavaScript代码,需要制定公约来避免冲突发生。Crockford认为不应该使用隐式全局变量。)
  • 没有发表意见:Idiomatic、jQuery、NPM、Node.js

命名风格

变量命名

  • 开始的第一个单词小写,之后的所有单词首字母大写:Google、NPM、Node.js、Idiomatic

var foo = "";var fooName = "";

常量命名

  • 使用大写字母:Google、NPM、Node.js

var CONS = 'VALUE';

  • 没有发表意见:jQuery、Idiomatic、Crockford

函数命名

  • 开始的第一个单词小写,之后的所有单词首字母大写(驼峰式):Google、NPM、Idiomatic、Node.js(推荐使用长的、具描述性的函数名)

function veryLongOperationNamefunction short()..

     关键字形式的函数命名:

function isReady()function setName()function getName()

  • 没有发表意见:jQuery、Crockford

阵列命名

  • 使用复数形式:Idiomatic 

var documents = [];

  • 没有发表意见:Google、jQuery、NPM、Node.js、Crockford

对象和类命名

  • 使用如下形式:Google、NPM、Node.js

var ThisIsObject = new Date;

  • 没有发表意见:jQuery、Idiomatic、Crockford

其他命名

  • 针对长文件名和配置键使用all-lower-hyphen-css-case形式:NPM

根据上述风格来配置.jshintrc文件

JSHint(http://www.jshint.com/)是一个JavaScript语法和风格检查工具,你可以用它来提醒代码风格相关的问题。它可以很好地被集成到许多常用的编辑器中,是统一团队编码风格的一个很好的工具。

你可以通过JSHint文档查看可用的选项:http://www.jshint.com/docs/#options

下面根据本文上面每个分类下的第一种风格来创建一个.jshintrc文件。你可以将它放到项目中根目录中,JSHint-avare代码编辑器将会按照它来统一项目中的所有代码风格。

{  "camelcase" : true,  "indent": 2,  "undef": true,  "quotmark": single,  "maxlen": 80,  "trailing": true,  "curly": true}

此外,你应该将下面的头添加到你的JavaScript文件中。

/* jshint browser:true, jquery:true */

在Node.js文件中你应该添加:

/*jshint node:true */

还可以在各种JavaScript文件中添加下面的声明:

'use strict';

这将影响JSHint和你的JavaScript引擎,可能不那么兼容,但是JavaScript将会运行得更快。

在提交Git之前自动执行JSHint

如果你想确保所有的JS代码与.jshintrc中定义的风格保持一致,你可以将下面的内容添加到你的.git/hooks/pre-commit文件中,当你试图提交任何新修改的文件到项目时会自动执行风格检查。

#!/bin/bash# Pre-commit Git hook to run JSHint on JavaScript files.## If you absolutely must commit without testing,# use: git commit --no-verifyfilenames=($(git diff --cached --name-only HEAD))which jshint &> /dev/nullif [ $? -ne 0 ];then  echo "error: jshint not found"  echo "install with: sudo npm install -g jshint"  exit 1fifor i in "${filenames[@]}"do	if [[ $i =~ \.js$ ]];	then		echo jshint $i		jshint $i		if [ $? -ne 0 ];		then			exit 1		fi	fidone

最后祝大家编码愉快!

英文原文:JavaScript, the winning style

移动周报:仰望大神,不如退而探索! 腾讯发布QQ浏览器微信版 支持拖拽分享、消息提醒等功能(图) 乐视TV:LetvUI连续31周迭代36个版本 190个乐迷需求实现119个 云服务商评估体系建立,首批10家企业通过可信云服务认证 《找你妹2》开发者云中游再声明:热酷涉嫌严重违约发布侵权竞品 柴可:大姨吗的轻应用抉择 盘点2013年IT界25个最古怪的面试题 云计算再掀创业热潮,19家企业入驻微软创投 IBM斥资12亿美元,全球大规模扩建数据中心 “Careerfocus之夜”2014年新春客户答谢晚宴在京举办 Google蚕食了维基百科的访问量? 微软Surface Pro 2 的成功之道 精简代码,为网站减负的十大建议 应用宝逆袭上位 将重构腾讯移动应用分发体系 eBay基础设施的成功经验,我们该如何复制? 自定义富媒体广告:NativeX SDK 5.0发布! WunderBar:零硬件开发基础也能接入物联网! 深入解析:分布式系统的事务处理经典问题及模型 从世纪互联、华云数据和金石易服的发展服路径观察IDC产业发展 SA:2014移动运营商、终端和应用十大关键趋势 使用modern.IE来设计更现代化的网页 全国顶级域名根服务器21日下午疑遭黑客攻击 影响巨大 苹果下一代iPhone的十大预测 《近匠》第07期,专访《恶魔塔防》团队,看俄国复杂深奥的游戏文化 代码托管网站GitHub的总裁和CEO进行职位互换 使用Chromebook的五个指南 云中游终极声明:热酷侵权,有种正面回答少打太极 背后故事:英特尔Edison中国研发 内部评审中曾三次被拒 全栈工程师会是未来的发展趋势吗? 大数据整理:囊括分片、存储方法、扩展等多个方面 物联网 ,下一个云计算市场 为何我的程序在VC编辑环境下按CTRL+F5不能正确RUN,在资源管理器下能正确RUN? make文件是怎么回事? oracle中long类型是什么类型? PB简单画图?保存到库表中? 用程序代码建立表结构的问题 怎么在状态栏中加入竖线分隔,而且调整字体的大小? 请高手帮帮我!!!! jbuilder4的enterprise setup需要weblogic51,但我的是weblogic6,应该怎样才能让jbuilder支持6啊? 关于数据库的并发操作 谁知道哪里有vb下载? 哪有可下载的AUTOCAD2000 如何用VB实现存折的打印???? 请教给TImage加滚动条的问题 我和她在一起的话,会开心吗 请大家看看这条语句有什么错? 关于isdn在win2000下共享的问题 各位水友,有力的出力,没力的看看,拜托 请从位高手帮小弟解决一个棘手的问题……………………多谢!!!!!!! ALLTEC(荔枝)兄弟,兄弟我接帖太快 :( 請這邊來. ★★★ 救命啊! VC 用ODBC访问 Access 数据库的问题 guo->你在www.linuxforum.net中叫什么?有个guoemail是你吗? 软件发布:市场摊位租赁管理系统Ver1.0 软件发布:量和单位转换软件(免费版) 软件发布:五笔快打 在listview中的各个记录listitem中,有没有双击记录的事件 软件发布:伏羲服装鞋业购销存管理系统 软件发布:进销存商务管理pcft-jxc 征集各地童谣.唤醒儿时记忆! 今天我请客! 有关vb调用excel的问题! 有没有关于BDE的单独的分发程序? VB中报表预览打印能不能实现象EXCEL中一样的“按比例缩放”?如何实现? 单机版流量统计 关于Delphi6的安装问题 动态计算公式怎么实现?? 常用的英文字体是什么? 在通信过程中怎样做到防监听、防篡改? 各位大虾现欲用java开发一套网上投票表决系统 应该看什么书?用什么开发工具?(一定给分!) 关于winsock的问题,急急 怎样使用VB6中TREEVIEW控件? 我真的要疯了! 这里有很多Delphi6的控件! 如何在ASP中传递多个参数?displaymsg.asp?page=1在后面我还想加另外一个参数 有没有喜欢画漫画的? 如何得到ActiveX控件的窗口句柄 请问mif文件格式以及、读写方法?高分求解 sco unix的root口令忘了,谢谢. 在PowerBuilder中使用Microsoft Web浏览器控件 ,这个控件在ole中怎么没有啊? 急盼有人答复!!!!!! 急!急!编译exe时出现:link errors提示 具体提示:create of executable file failed? 小笨笨一问 (最好回答可以赢得财富值50)计时为10分钟内.1、图上20厘米表示实际480千米,这幅图的比例尺是().2、一个长方形的长宽高分别是9cm、4cm、5cm,它的体积是()cm³,表面积是()cm².5、 某工作如果由第一、二、三小队合干需要12天才能完成;如果由第一、三、五小队合干需要7天才能完成;如果由第二、四、五小队合干需要8天才能完成;如果由第一、三、四小队合干需要42 求2道数学题的解法1.已知非空集合A={(x,y)|(a*2-1)x+(a-1)y=15},B={(x,y)|y=(5-3a)x-2a}.若A∩B=空集,求a的值.2.已知集合A={x|x*2-4mx+2m+6=0,x∈R},B={x|x<0,x∈R},若A∩B≠空集,求实数m的取值范围.a*2表示a 17.菜场运来的萝卜比白菜多1.52吨,卖出0.2吨萝卜和0.4吨白菜后,白菜和萝卜的重量的比是7:9,原来各运来多少吨? 我想要小学一年级上学期的数学题在哪里找 面积为49平方米的长方形的周长是多少?.注意是长方形,不是正方形 给个准确的数啊,还有解法 六年级奥数题,超急!要列计算过程!19.仓库里有一批化肥,运走45吨后,又运走余下的40%,这时剩下的化肥和两次共运走的同样多,仓库原有化肥多少吨? 三个人同时吃3个西红柿,用了3分钟吃完,6个人吃6个西红柿需要几分钟吃完?(仅用加减法列个式子) 下列结论错误的是()A.长度之比为1:2:3的三角形是直角三角形B.三个边长之比为3:4:5的三角形是直角三角形C.三个边长之比为8:16:17的三角形是直角三角形D.三个角度之比为1:1:2的三 红星厂制造一批零件,计划每天制造200个,15天完成,实际每天超产50个,多少天可以完成任务? 0952873641 3的前面第三个的后面第五位是几?到底多少呀 能不能讲下 5555555 某公司托运物品,质量为a(a 1.甲、乙两箱苹果的数量的比是4:5,如果从甲箱取12个放入乙后,甲、乙两箱粉笔的数量比是7:5,两箱苹果共有多少个?打错,是甲乙两箱苹果的数量是7:不是粉笔,还有,刚开始甲、乙两箱苹果的 小学六年级奥数题,帮帮忙,最好有过程,谢谢!菜园里西红柿获得丰收,手下全部的八分之三是,装满一些筐还多24千克,收完其余部分时,又刚好装满6框,求共收西红柿多少千克? 在RT三角形ABC中,角C=90度,AD平行BC,角ABE=2角CBE,求证ED=2ABBD把角ABC分为角CBE和EBA,BE延长到D点,AD平行与三角形ABC底边BC,ADB也构成一个钝角三角形另外,不能用三角函数做,只能用几何 1.一根柱子长方体,上、下底面和天花板和地面连接,长50厘米,宽40厘米,柱高8米.上、下底不需要上砖,四面贴砖,每平方米砖50元,贴完四面需要多少元?2.小强有邮票87张,小红有48张,小强给了小红 小学六年级奥数题 要过程的在第16届广州亚运会上,中国代表团取得了金牌第一的成绩.获得的金牌数比铜牌数的2倍还多3块,如果金牌再多1块,那么铜牌就是金牌的49%,银牌是金牌数的59.5%.问 问一个初二的数学题,要解法! ! !有一个三位数,现将最左边的数字移到最右边,则比原来的数小45;又知百位数字的9倍比去掉百位数字后形成的两位数小3,试求原来的三位数是多少?要具体的解 1.一个数的9分之17倍是34.这个数是多少?2.甲数与乙数的和是16,甲数是乙数的3分之1.甲、乙两数个是多少?3.400减去它的4分之1后,正好等于一个数的5分之3,求这个数是多少? 两段圆柱的体积之差是314立方厘米.若将它们分别削成底面是最大正方形的长方体,则两个长方体体积之差是多少立方厘米? 小学三年级一题有多种解法的数学题 列式计算,红花有60朵:列式计算1.比黄花多1/5:2.是黄花的1/3:3.比黄花少1/6:4.黄花比红花多2/3:5.黄花比红花少1/6:6.黄花是红花的7/10:饲养场养鸡480只.鸡比鸭多1/8,鸭有多少只?一共有多少 实验室了有两个等高的容器,圆锥体容器的半径为9厘米,圆柱体容器的半径是6厘米,现在圆锥体容器装满水倒入圆柱体容器中,这是水深比容器的高度的6/7低3厘米,两个容器的高是多少厘米? 求助:三年级一道数学题的解法.有两个一样的信箴,如果一个信封里放1 张信纸,还剩50张信纸;如果每个信封放3张信纸,还剩50个信封.请问:有几个信封,有几张信纸?不要设未知数. 一道奥林匹克的数学题,一辆车从甲地到乙地.如果把速度提高20%,可比原定时间提前1小时到,如果以原定时间1小时到达,如果一原定速度,如果以原速度行驶120千米后,则可以提前40分钟到达,那么 :用10张同样长的纸条粘贴成一条长51厘米的纸条.如果每个粘贴处都重叠1厘米,那么每张纸条长多少厘米? 今年的8月份有5个星期日,4个星期一,那么今年的8月1日是星期几?我的方法是从31是星期日,倒推到3号是第一个星期日,那么1号就知道了.请问有没有更简便的方法? 六年级语文数学题!在线等!数学题:1:李叔叔去年按每股4元的价格买了民生银行股票2500股,到今年10月1日按每股6元的价钱卖出.在股票交易中,无论买卖都要缴纳0.3%的印花税和0.2%的其他费用. 1、一个长方体的长和宽都是5厘米,把它从长的中点截成两个相同的长方体后,得到的一个长方体表面积比原来大长方体表面积少120平方分米,原来长方体的体积是多少?2、两种商品的价格比试7:3 请帮忙解题:一个小学二年级的数学题2个小铅球比一个大铅球重1千克,8个小铅球比5个大铅球轻1千克,算一算,大小铅球各重多少千克?这是二年级的数学题,不能用方程解,但需要列出算式. 造句:鹅毛般的苇絮恶狼般的眼睛为了 ...为了...为了.哑然失笑:急中生智:名言名句大提问挫折:灵感:成功:上衣和裤子的价格各是多少元?裤子的价格是上衣的三分之一,一套衣服共320元 1.某单位食堂一月内购买了三次大米,后两次购买数量是前一次的两倍,由于数量增加,每次加个都比前一次优惠10%,共用去2536.8元.如果下月一次性购买同样多的大米,可至少节约多少元?2.一个长 小学五年级数学奥数题的答案?1.( )÷12=1:( )=3/( )=0.5=( )%2.把0.13万改写成以“一”为单位的数是( ),读作( ).3.在括号里填上合适的单位名称.(1)一个鸡蛋重50 一:忽然,像一阵风吹来的,远处的小丘上出现了一群马,马上的男女老少都穿个色的衣裳,群马疾驰,襟飘带舞,像一条彩虹朝我们飞来.“像一阵风吹来”说明________________,“彩虹”说明_____________ 丙在计算除法(有余数)是,吧除数137写作173,商多3,余数相同.求正确德商和余数 1.边长为自然数,面积为105的长方形.不同的长方形共有几种? 已知关于x的一元一次不等式3x+a/-13<3x-a/2的解集为x<7,求a的值. 两人:A,B从甲地和乙地同时出发,相向而行.第一次相遇离甲地5千米,然后继续走.走到两地后立即返回,第二次相遇离乙地2千米.问:甲乙两地相距多少千米? 一辆汽车共载客50人,其中一部分人买A票,每张1.20元;另一部分人买B票,每张1.00元,售票员最后统计出所卖的A票比B票多收入16元.买A票的有多少人?绝对要有解法,带讲解的我可能会追加的!赶快, 给我解个数学题,我不会解某人去银行存钱,利率是5%,是复利.此人第一年取1万,第二年两万,第n年取n万,要求每年都能取到钱.求此人一次性至少要存多少钱? 一辆车从甲地开往乙地,如果将车速提高20%,可以提前1小时到达,如果按原速行驶120千米后,再将车速提高25%,可以提前401分钟到达,甲、乙两地相差多少千米? 要把题目类型和解法写出来, 在平面直角坐标系中,已知反比例函数y=负x分之3m,和一次函数y=kx-1的图像都经过点p(m,-3m).求反比例函数的解析式. 1、长72米的列车,追上长108米的货车到完全超过用了10秒,如果货车速度为原来的1.4倍,哪么列车追上到超过货车就需要15秒.货车的速度是每秒多少米?2、一座大桥长1275米,一列火车过这座大桥.从 一个羽毛球4元,一个乒乓球2元.买这些花了100元.如果把羽毛球都换成乒乓球,乒乓球都换成羽毛球,则需要花92元.原来买这些乒乓球和羽毛球各多少个? 1.小华读一本书,当他读了全书的三分之二时,发现已经读了的页数比剩下的多30页,这本书多少页?2.求出图中阴影部分的面积.单位 cm总体是个半圆,画的不太标准,看懂得来算了,第二题大家都不 一列客车从甲城开往乙城,每小时行60千米,行了2小时后,从乙城往甲城开出一列货车,4小时与客车相遇,这时货车行了全程的3分之1,两城相距多少千米? 游乐中心内一个长方形游泳池,长25厘米,宽12.5厘米,深1.2厘米.如果用直径20厘米的进水管向游泳池内注水,水流速度按每分100厘米计算,注满一池水要多长时间? 一道数学题,十分钟内解答家100~一个晒烟厂用100克的海水可以晒出3克盐如果一块盐田一次放入5000吨的海水可以晒出多少吨盐? 请用算式答小李算长方形的体积时,误将宽多算了五分之一,高少算了四分之一,结果比正确答案少了40立方厘米,那么该长方形实际体积是多少?大家请用算式答!大家请不要回答的太深奥,我才 求助小学六年级寒假作业一道数学题解法甲、乙两人以匀速绕圆形跑道按相反方向跑步,出发点在直径的两个端点,如果他们同时出发,并在乙跑完100米时,第一次相遇,甲跑一圈还差60米时第二次 10分钟之内回答,谢在数轴上的点A对应的数是-3又1/2,那么与点A相距3个单位长度的点所表示的数是:________.错了 小学(超难的)我国个人所得税规定;个人月收入超过800元的部分应缴纳个人所得税,超过部分中,个人所得税率为;超过部分 500元 501~1500税率 5% 10%叔叔上月的税后工资为1500元,他交纳了多少 求这2道数学题解法1:求f(x)=cosx-1/2cos2x的最大值(x属于R)2:求sin10°sin30°sin50°sin70°的值 一共有两道哈.1、一桶油,第一次倒出它的六分之一,第二次比第一次多倒出20千克,这时已倒出的油与剩下的油的比是7:5,这桶油原来有多少千克?2、甲、乙两个书架,共有图书3000本,甲书架上本数 甲乙二人分别从东西两村同时相向而行,第一次相遇于距东村36公里处.二人继续前行,至目的地后折返,在距东村54公里处第二次相遇.问::东西两村的距离. 求2道数学题的解法1:tan71+tan49-√3tan71·tan492:(1-tan17)/(1+tan17) + cos146/(1+sin34) 《当堂练》上的六年级数学题,十分钟内1.有一个底面半径是2cm,容积是31.4毫升的圆锥形容器的高是多少厘米?(算式,2.一个圆柱体和一个圆锥体的底面积和高都相等已知圆柱底面周长是12.56分 ABCDE×ABCDE———————XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX———————XXXXXABCDE 求A+B+C+D+E=?A= B= C= D= E=ABCDE不可能是零 急求2道数学题的解法!1.一种书若定价每本10元,可盈利1/4,若想盈利2/5,则应定价为每本()元2.同一种商品,甲将原价降低10元后卖掉,用售价的10%作积累,乙将原价降低20元后,用售价的20%作积累,
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn