您好,欢迎访问三七文档
当前位置:首页 > 财经/贸易 > 资产评估/会计 > javascript书写规范
Javascript书写规范:1.文件编码统一为utf-8;2.书写过程过,每行代码结束必须有分号;3.库引入:原则上仅引入jQuery库;4.变量命名:以下划线链接每个单词,类型_变量名;s:表示字符串;n:表示数字;b:表示逻辑;a:表示数组;r:表示正则表达式;f:表示函数;o:表示以上未涉及到的其他对象;变量在作用域的顶部申明。5.常量:全部大写,以下划线分隔如网站的URL,域,图片目录路径,js和css用到的目录路径;6.类命名:首字母大写,驼峰式命名.如Comment;7.函数命名:首字母小写驼峰式命名.如getUserName();8.类中私有方法,以下划线+方法名标注,私有方法不能在类外被调用。9.命名语义化,尽可能利用英文单词或其缩写;10.代码结构明了化,加适量注释.提高函数重用率;1)大功能区块的功能描述(类,函数)/*功能描述参数描述返回值*/2)单行的注释(放在行末尾)//注释11.注重与html分离,减小reflow,注重性能.12.Dom中自定义的class,以j_classname的形式13.把外部JavaScript文件放在HTML底部,/body的前面14.优化循环(循环体中若有Dom操作,应该把Dom操作提到循环体外;在同一作用域内,Dom选择赋值给一局部变量。)15.单引号和双引号为了避免混乱,我们建议在HTML中使用双引号,在JavaScript中使用单引号。//htmlimgsrc==text/javascriptdocument.write('p');/script//一段混用的jQuery代码$('h1').after('divid=contenth2目录/h2ol/ol/div');16.使用更简单的格式来写innerscript//早期的代码可能是这样的scripttype=text/javascriptlanguage=javascript.../script//现在不用language属性了scripttype=text/javascript.../script17.总是检查数据要检查你的方法输入的所有数据,一方面是为了安全性,另一方面也是为了可用性。用户随时随地都会输入错误的数据。这不是因为他们蠢,而是因为他们很忙,并且思考的方式跟你不同。用typeof方法来检测你的function接受的输入是否合法。18.避免混入其他技术,js不直接控制css详细的设置,可控制classname19.避免全局变量(类名空间App.dialog.)全局变量和全局函数是非常糟糕的。因为在一个页面中包含的所有JavaScript都在同一个域中运行。所以如果你的代码中声明了全局变量或者全局函数的话,后面的代码中载入的脚本文件中的同名变量和函数会覆盖掉(overwrite)你的。//糟糕的全局变量和全局函数varcurrent=null;functioninit(){...}functionchange(){...}functionverify(){...}解决办法有很多,ChristianHeilmann建议的方法是://如果变量和函数不需要在“外面”引用,那么就可以使用一个没有名字的方法将他们全都包起来。(function(){varcurrent=null;functioninit(){...}functionchange(){...}functionverify(){...}})();//如果变量和函数需要在“外面”引用,需要把你的变量和函数放在一个“命名空间”中//我们这里用一个function做命名空间而不是一个var,因为在前者中声明function更简单,而且能保护隐私数据myNameSpace=function(){varcurrent=null;functioninit(){...}functionchange(){...}functionverify(){...}//所有需要在命名空间外调用的函数和属性都要写在return里面return{init:init,//甚至你可以为函数和属性命名一个别名set:change}}();20.声明变量的话,总是用varJavaScript中的变量可能是全局域或者局部域,用var声明的话会更加直观。21.避免使用eval()方法(ajax数据请求验证)JavaScript中的eval()方法是在运行时把任何代码当作对象来计算/运行的方法。实际上由于安全性的缘故,大部分情况下都不应该用eval(),总是有一种更“正确”的方法来完成同样的工作的。基本原则是,evalisevil,在任何时候都不要用它,除非你是一个老手,并且知道你不得不这样做。22.不要偷懒省略”和{}从技术上说,你可以忽略很多花括号和分号。//虽然看上去很不对头,大部分浏览器都能正确解析这段代码if(someVariableExists)x=false//这个代码看上去更不对头了,咋眼一看似乎下面的句都被执行了//实际上只有x=false在if中if(someVariableExists)x=falseanotherFunctionCall();所以,要记住的原则是:1.永远不要省略分号;2.不要省略花括号,除非在同一行中。//这样是OK的if(2+2===4)return'nicelydone';23.获取对象属性的时候用方括号而不是点号在JavaScript中取得某对象的属性有两种方法://点号标记MyObject.property//方括号标记MyObject[property]如果是用点号标记取得对象的属性,属性名称是硬编码,无法在运行时更改;而用方括号的话,JavaScript会求得方括号内值然后通过计算结果来求得属性名。也就是说用方括号标记的方式,属性名称可以是硬编码的,也可以是变量或者函数返回值。//这样是不行的MyObject.value+i//这样就没有问题MyObject[value+i]24.forin语句遍历一个对象中的所有条目的时候,用forin语句是非常方便的。但有时候我们不需要遍历对象中的方法,如果不需要的话,可以加上一条filter。//加上了一个过滤器的forin语句for(keyinobject){if(object.hasOwnProperty(key){...thendosomething...}}25.代码排版缩进tab长度为4行长度,控制在可视范围内,以一个分号结束花括号,如果是一个代码段,花括号紧跟在语句的后面文件功能定义base:网站常量common:@我,自动延伸高,插入表情,统计字数,全选,收藏心跳,分享站外,关注,弹窗,拖拽,top至顶page制作要求:1、弹窗:按设计图还原即可,不用考虑弹窗的位置。2、对于网页代码,一定要保持足够的精简,拷贝的无用代码一定要删除。3、标签的语义化,不能滥用标签。4、尽可能不用标签ID来控制样式。后端:js功能性修改,需要通知前端。全局命名空间污染与IIFE总是将代码包裹成一个IIFE(Immediately-InvokedFunctionExpression),用以创建独立隔绝的定义域。这一举措可防止全局命名空间被污染。IIFE还可确保你的代码不会轻易被其它全局命名空间里的代码所修改(i.e.第三方库,window引用,被覆盖的未定义的关键字等等)。不推荐1.varx=10,2.y=100;3.4.//Declaringvariablesintheglobalscopeisresultinginglobalscopepollution.Allvariablesdeclaredlikethis5.//willbestoredinthewindowobject.Thisisveryuncleanandneedstobeavoided.6.console.log(window.x+''+window.y);推荐1.//WedeclareaIIFEandpassparametersintothefunctionthatwewillusefromtheglobalspace2.(function(log,w,undefined){3.'usestrict';4.5.varx=10,6.y=100;7.8.//Willoutput'truetrue'9.log((w.x===undefined)+''+(w.y===undefined));10.11.}(window.console.log,window));IIFE(立即执行的函数表达式)无论何时,想要创建一个新的封闭的定义域,那就用IIFE。它不仅避免了干扰,也使得内存在执行完后立即释放。所有脚本文件建议都从IIFE开始。立即执行的函数表达式的执行括号应该写在外包括号内。虽然写在内还是写在外都是有效的,但写在内使得整个表达式看起来更像一个整体,因此推荐这么做。不推荐1.(function(){})();推荐1.(function(){}());so,用下列写法来格式化你的IIFE代码:1.(function(){2.'usestrict';3.4.//Codegoeshere5.6.}());如果你想引用全局变量或者是外层IIFE的变量,可以通过下列方式传参:1.(function($,w,d){2.'usestrict';3.4.$(function(){5.w.alert(d.querySelectorAll('div').length);6.});7.}(jQuery,window,document));严格模式ECMAScript5严格模式可在整个脚本或独个方法内被激活。它对应不同的javascript语境会做更加严格的错误检查。严格模式也确保了javascript代码更加的健壮,运行的也更加快速。严格模式会阻止使用在未来很可能被引入的预留关键字。你应该在你的脚本中启用严格模式,最好是在独立的IIFE中应用它。避免在你的脚本第一行使用它而导致你的所有脚本都启动了严格模式,这有可能会引发一些第三方类库的问题。不推荐1.//Scriptstartshere2.'usestrict';3.4.(function(){5.6.//Yourcodestartshere7.8.}());推荐1.(function(){2.'usestrict';3.4.//Yourcodestartshere5.6.}());变量声明总是使用var来声明变量。如不指定var,变量将被隐式地声明为全局变量,这将对变量难以控制。如果没有声明,变量处于什么定义域就变得不清(可以是在Document或Window中,也可以很容易地进入本地定义域)。所以,请总是使用var来声明变量。采用严格模式带来的好处是,当你手误输入错误的变量名时,它可以通过报错信息来帮助你定位错误出处。不推荐1.x=10;2.y=100;推荐1.varx=10,2.y=100;理解JavaScript的定义域和定义域提升在JavaScript中变量和方法定义会自动提升到执行之前。JavaScript只有function级的定义域,而无其他很多编程语言中的块定义域,所以使得你在某一function内的某语句和循环体中定义了一个变量,此变量可作用于整个function内,而不仅仅是在此语句或循环体中,因为它们的声明被JavaScript自动提升了。我们通过例子来看清楚这到底是怎么一回事:原function1.(function(log){2.'usestrict';3.4.vara=10;5.6.for(vari=0;ia;i++){7.varb=i*i;8.log(b);9.}10.11.if(a===10){12.varf=function(){13.log(a);14.};15.f
本文标题:javascript书写规范
链接地址:https://www.777doc.com/doc-2880397 .html