首页

源码搜藏网

首页 > 开发教程 > 网页设计 >

JavaScript开发规范要求(3)

创建时间:2013-04-26 15:50  

 作为一名开发人员(WEB前端JavaScript开发),不规范的开发不仅使日后代码维护变的困难,同时也不利于团队的合作,通常还会带来代码安全以及执行效率上的问题。本人在开发工作中 就曾与不按规范来开发的同事合作过,与他合作就不能用“愉快”来形容了。现在本人撰写此文的目的除了与大家分享一点点经验外,更多的是希望对未来的合作伙 伴能够起到一定的借鉴作用。当然,如果我说的有不科学的地方还希望各路前辈多多指教。下面分条目列出各种规范要求,这些要求都是针对同事编码毛病提出来 的,好些行业约定的其它规范可能不会再提及。  1、保证代码压缩后不出错
  对于大型的JavaScript项目,一般会在产品发布时对项目包含的所有JavaScript文件进行压缩处理,比如可以利用Google Closure Compiler Service对代码进行压缩,新版jQuery已改用这一工具对代码进行压缩,这一般会去掉开发时写的注释,除去所有空格和换行,甚至可以把原来较长的变量名替换成短且无意义的变量名,这样做的目的是加快文件的下载速 度,同时也减小网站访问带来的额外数据流量,另外在代码保护上也起到了一点点作用,至少压缩后的代码即使被还原还是没那么容易一下读懂的。要想代码能正确 通过压缩,一般要求语句都要以分号正常结束,大括号也要严格结束等,具体还要看压缩工具的要求。所以如果一开始没有按标准来做,等压缩出错后再回去找错误 那是浪费时间。
JavaScript开发规范要求(3)
  2、保证代码能通过特定IDE的自动格式化功能
  一般较为完善的开发工具(比如Aptana Studio)都有代码“自动格式”化功能,这一功能帮助实现统一换行、缩进、空格等代码编排,你可以设置自己喜欢的格式标准,比如左大括号{是否另起一 行。达到这个要求的目的在于方便你的开发团队成员拿你代码的一个副本用IDE自动格式化成他喜欢或熟悉的风格进行阅读。你同事需要阅读你的代码,可能是因 为你写的是通用方法,他在其它模块开发过程中也要使用到,阅读你的代码能最深入了解方法调用和实现的细节,这是简单API文档不能达到的效果。
JavaScript开发规范要求(3)
  3、使用标准的文档注释
  这一要求算是最基本的,这有利于在方法调用处看到方法的具体传参提示,也可以利用配套文档工具生成html或其它格 式的开发文档供其他团队成员阅读,你可以尝试使用jsdoc-toolkit。如果你自动生成的API是出自一个开放平台,就像facebook.com 应用,那么你的文档是给天下所有开发者看的。另外编写完整注释,也更方便团队成员阅读你的代码,通过你的参数描述,团队成员可以很容易知道你编写的方法传 参与实现细节。当然也方便日后代码维护,这样即使再大的项目,过了很长时间后,回去改点东西也就不至于自己都忘记了当时自己写的代码是怎么一回事了。
JavaScript开发规范要求(3)
  4、使用规范有意义的变量名
  使用规范有意义的变量名可以提高代码的可读性,作为大项目开发成员,自己写的代码不仅仅要让别人容易看懂。开发大项目,其实每个人写的代码量可 能都比较大,规范命名,日后自己看回自己的代码也显的清晰易懂,比如日后系统升级或新增功能,修改起代码来也轻松多了。如果到头发现自己当初写的代码现在 看不太懂了,那还真是天大的笑话了。
  当然,使用有意义的变量名也尽量使用标准的命名,比如像这里:var me = this也许没有var self = this好,因为self是Python中的关键字,在Python中self就是通常语言this的用法。再看下面一个例子,加s显然比没有加来的科学 些,这样可以知道这个变量名存的是复数,可能是数组等:

var li = document.getElementsByTagName('li')
var lis = document.getElementsByTagName('li')
JavaScript开发规范要求(3)
  5、不使用生偏语法
  JavaScript作为一门动态脚本语言,灵活性既是优点也是缺点,众所周知,动态语言不同层次开发人员对实现同样一个功能写出来的代码在规范或语法上会存在较大的差别。不管怎么样,规范编码少搞怪,不把简单问题复杂化,不违反代码易读性原则才是大家应该做的。
  比如这语句:typeof(b) == ‘string’ && alert(b)应该改为:if (typeof(b) == ‘string’) alert(b),像前面那种用法,利用了&&运算符解析机制:如果检测到&&前语句返回false就不再检测后面语 句,在代码优化方面也有提到把最可能出现的情况首先判断,像这种写法如果条件少还好,如果条件较多而且语句也长,那代码可读性就相当差。
  又比如:+function(a){var p = a;}( ‘a’)应该改为:(function(a){var p = a;})( ‘a’),其实function前面的+号与包含function的()括号作用是一样的,都是起运算优先作用,后者是常见且容易看明白的防止变量污染的 做法,比如好些流行JavaScript框架就是采用后面这种方式。

上一篇:浅谈Ajax技术中的先进性与局限性
下一篇:javascript和html判断浏览器类型
  • JavaScript可否多线程?
    JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感, 例如 [javascript] setTimeout( function(){ alert(你好!); } , 0); setInterval( callbackFunction , 100); se
  • JavaScript对象方法的使用
    1/创建对象实例 一旦对象定义完成后,就可以为该对象创建一个实例了: NewObject=New object(); 其中Newobjet是新的对象,Object已经定义好的对象.例: U1=New university(广州达内,广州达内,January 05,199712:00:00,) U2=New university(广州达内,广州,January
  • javascript和html判断浏览器类型
    javascript判断 navigator.userAgent.indexOf(iPhone) HTML判断IE类型 1. !--[if !IE]!-- 除IE外都可识别 !--![endif]-- 2. !--[if IE] 所有的IE可识别 ![endif]-- 3. !--[if IE 5.0] 只有IE5.0可以识别 ![endif]-- 4. !--[if IE 5] 仅IE5.0与IE5.5可以识别
  • Javascript中最常用的61个经典技巧
    1. oncontextmenu=window.event.returnValue=false 将彻底屏蔽鼠标右键 table border oncontextmenu=return(false)tdno/table 可用于Table 2. body onselectstart=return false 取消选
  • 给网页设计师和前端开发者看的前端性能优化(1)
    在这篇长文章中,我将分享收获,关于快速,简单且非常有趣的性能知识的点点滴滴,以便使你的行为可以像一个初级的网页设计师和前端开发者