编程风格

缩进层级

if(wl&&wl.length){for(i=0,1=wl.length;i<1;++i){p=wl[i];type=Y.Lang.type(r[p]);if(s.hasOwnProperty(p)){if(merge&&type=='object'){Y.mix(r(p],s{p]);}elseif(ov||!(pinr)){r[p]=s[p];}}}}

if(wl&&wl.length){for(i=0,1=wl.length;i<1;++i){p=wl[i];type=Y.Lang.type(r[p]);if(s.hasOwnProperty(p)){if(merge&&type=='object'){Y.mix(r[p],s[p]);}elseif(ov||!(pinr)){r[p]=s[p];}}}}

语句结尾

// 原始代码functiongetData(){return{title:"Maintainable JavaScript",author:"Nicholas C. Zakas"}}// 分析器会将它理解成functiongetData(){return;{title:"Maintainable JavaScript",author:"Nicholas C. Zakas"};}

// 这些语句与上一句没有分号的语句连接的话会直接报错，所以必须加分号;[1,2,3].foreach(function(){// 处理内容});`shenxf${nickname}`.length// 很多代码都习惯于在圆括号之前加一个分号，这是由于之前引入的代码可能有漏了分号的情况，// 为了以防万一，都会有类似于下面的代码。;(function(){// 处理内容。})()

行的长度

换行

// 好的做法：在运算符后面换行。 第二行追加二个缩进callAFunction(document,element,window,"some string value",true,123,navigator);// 不好的做法第二行只有一个缩进callAFunction(document,element,window,"some string value",true,123,navigator);// 不好的做法运算符之前换行了callAFunction(document,element,window,"some string value",true,123,navigator);

if(isLeapYear&&isFebruary&&day&&day==29&&itsYourBirthdady&&noPlans){waitAnotherFourYears();}

varresult=something+anotherThing+yetAnotherThing+someThingElse+anotherSomethingElse;

空行

if(wl&&wl.length){for(i=0,1=wl.length;i<1;++i){p=wl[i];type=Y.Lang.type(r[p]);if(s.hasOwnProperty(p)){if(merge&&type=='object'){Y.mix(r[p],s[p]);}elseif(ov||!(pinr)){r[p]=s[p];}}}}

if(wl&&wl.length){for(i=0,1=wl.length;i<1;++i){p=wl[i];type=Y.Lang.type(r[p]);if(s.hasOwnProperty(p)){if(merge&&type=='object'){Y.mix(r[p],s[p]);}elseif(ov||!(pinr)){r[p]=s[p];}}}}

命名

变量和函数

// 好的写法varcount=10;varmyName="shenxf";varfound=true;// 不好的写法: 变量看起来像函数vargetCount=10;varisFound=true;// 好的写法functiongetName(){returnmyName;}// 不好的写法functiontheName(){returnmyName;}

if(isEnabled()){setName("shenxf");}if(getName()==="shenxf"){doSomething();}

常量

varMAX_COUNT=10;varURL="http://shenxf.top";

if(count<MAX_COUNT){doSomething();}

构造函数

// 好的做法functionPerson(name){this.name=name;}Person.prototype.sayName=function(){alert(this.name);}varme=newPerson("shenxf");

varme=Person("shenxf");// 这里缺少了newvaryou=getPerson("xx");

直接量

字符串

// 下面都是合法的javascript代码varname="shenxf says, \"Hi.\"";varname='shenxf says, "Hi."';

// 不好的写法varlongString="Here's the story, of a man \named Brady.";// 好的写法varlongString="Here's the story, of a man"+"named Brady.";

数字

// 整数varcount=10;// 小数varprice=10.0;varprice=10.00;// 不推荐小数的写法：没有小数部分varpricee=10.;// 不推荐小数的写法：没有整数部分varprice=.1;// 不推荐的写法：八进制写法已经被弃用varnum=010;// 十六进制写法varnum=0xA2;// 科学计数法varnum=1e23;

null

// 好的用法varperson=null;// 好的用法functiongetPerson(){if(condition){returnnewPerson("shenxf");}else{returnnull;}}// 好的用法varperson=getPerson();if(person!==null){doSomething();}// 不好的写法：用来和未初始化的变量进行比较varperson;if(person!=null){doSomething();}// 不好的写法：检测是否传入了参数functiondoSomething(arg1,arg2,arg3,arg4){if(arg4!=null){doSomethingElse();}}

undefined

// 不好的写法varperson;console.log(person===undefined);//true

// foo未被声明varperson;console.log(typeofperson);// "undefined"console.log(typeoffoo);// "undefined"

// 好的做法varperson=null;console.log(person===null);// true

对象直接量

// 不好的写法varbook=newObject();book.title="shenxfsbook";book.author="shenxf";

// 好的写法varbook={title:"shenxfsbook",author:"shenxf"};

数组直接量

// 不好的写法varcolors=newArray("red","green","blue");varnumbers=newArray(1,2,3,4);// 好的写法varcolors=["red","green","blue"];varnumbers=[1,2,3,4];

单行注释

// 这是一句单行注释

// 好的写法if(condition){// 如果代码执行到这里，则表示通过了左右的安全性检查allowed();}// 不好的写法：注释之前没有空行if(condition){// 如果代码执行到这里，则表示通过了左右的安全性检查allowed();}// 不好的写法：错误的缩进if(condition){// 如果代码执行到这里，则表示通过了左右的安全性检查allowed();}// 好的写法varresult=something+somethingElse;// somethingElse不应当取值为null// 不好的写法：代码和注释之间没有间隔varresult=something+somethingElse;// somethingElse不应当取值为null// 好的写法// if (condition) {//     dosomething();//     thenDoSomethingElse();// }// 不好的写法:这里应当用多行注释// 接下来的这段代码非常难，那么，让我详细的解释下// 这段代码首先判断条件是否为真// 。。。。。。。if(condition){// 如果代码执行到这里，则表示通过了左右的安全性检查allowed();}

多行注释

/* 我的注释 *//* 另一段注释这个注释包含2行 *//*又是一段注释这段注释同样包含2行*/

/* * 另一段注释 * 这个注释包含2行 */

// 好的写法if(condition){/*     * 如果代码执行到这里     * 说明通过了所有安全性检查     */allowed();}// 不好的写法：注释之前无空行if(condition){/*     * 如果代码执行到这里     * 说明通过了所有安全性检查     */allowed();}// 不好的写法：星号之后没有空格if(condition){/*     *如果代码执行到这里     *说明通过了所有安全性检查     */allowed();}// 不好的写法：错误的缩进if(condition){/* * 如果代码执行到这里 * 说明通过了所有安全性检查 */allowed();}// 不好的写法：代码尾部不要用多行注释varresult=something+somethingElse;/*somethingElse不应当取值为null*/

使用注释

// 不好的写法：注释并没有提供有价值的信息// 初始化countvarcount=10;// 好的写法// 改变这个值可能会使它变成青蛙varcount=10;

难以理解的代码

// 好的写法if(mode){/*     * 当 mode 为2时     * 用来执行原型合并的操作。。。。     * 。。。。     */if(mode===2){Y.mix(receiver.prototype,supplier.prototype,overwrite,whitelis,0,merge);}/*      * 根据模式的类型。。。      * 。。。。      */from=mode===1||mode===3 ?supplier.prototype :supperlier;to=mode===1||mode===4 ?receiver.prototype :receiver;/*     * .......     * ......     */if(!from||!to){from=supperlier;to=receiver;}}else{from=supplier;to=receiver;}

可能被误认为错误的代码

while(element&&(element=element[asix])){// 赋值操作if((all||element[TAG_NAME])&&(!fn||fn(element))){returnelement;}}

游览器特性hack

varret=false;if(!needle||!element||!needle[NODE_TYPE]||!element[NODE_TYPE]){ret=false;}elseif(element[CONTAINS]){// 如果needle不是ELEMENT_NODE时，IE和Safari下会有错误if(Y.UA.opera||needle[NODE_TYPE]===1){ret=element[CONTAINS](needle);}else{ret=Y_DOM._bruteContains(element,needle);}}elseif(element[COMPARE_DOCUMENT_POSITION]){// geckoif(element===needle||!!(element[COMPARE_DOCUMENT_POSITION](needle)&16)){ret=true}}

文档注释

/**返回一个对象，这个对象包含被提供对象的所有属性。后一个对象的属性会覆盖前一个对象的属性。传入一个单独对象。。。。@method merge@param {Object} 被合并的一个或多个对象@param {Object} 一个新的合并后的对象**/Y.merge=function(){varargs=arguments,i=0,len=args.length,result={};for(;i<len;++i){Y.mix(result,args[i],true);}returnresult;};

花括号的对齐方式

块语句的间隔

switch语句

缩进

switch(condition){case"first":// 代码break;case"second":// 代码break;case"third":// 代码break;default:// 代码}

switch(condition){case"first":// 代码break;case"second":// 代码break;case"third":// 代码break;default:// 代码}

case语句的“连续执行”

switch(condition){// 明显的依次执行case"first":case"second":// 代码break;case"third":// 代码/* fall through */default:// 代码}

default

switch(condition){case"first":// 代码break;case"second":// 代码break;default:// default中没有逻辑}

switch(condition){case"first":// 代码break;case"second":// 代码break;// 没有 default}

with语句

varbook={title:"shenxf javascrpt",author:"shenxf"};varmessage=" The book is ";with(book){message+=title;message+=" by "+author;}

for循环

varvalues=[1,2,3,4,5,6,7],i,len;for(i=0,len=values.length;i<len;i++){process(values[i]);}

varvalues=[1,2,3,4,5,6,7],i,len;for(i=0,len=values.length;i<len;i++){if(i!==2){process(values[i]);}}

for-in循环

varprop;for(propinobject){if(object.hasOwnProperty(prop)){console.log("Property name is "+prop);console.log("Property value is "+object[prop]);}}

varprop;for(propinobject){// 包含对原型链的遍历console.log("Property name is "+prop);console.log("Property value is "+object[prop]);}

// 不好的用法varvalues=[1,2,3,4,5],i;for(iinvalues){process(item[i]);}

变量声明

functiondoSomething(){varresult=10+value;varvalue=10;returnresult;}

functiondoSomething(){varresult;varvalueresult=10+value;value=10;returnresult;}

functiondoSomethingWithItems(items){varvalue=10,result=value+10,i,len;for(i=0,len=items.length;i<len;i++){doSomething(items[i]);}}

函数声明

// 不好的写法doSomething();functiondoSomething(){alert('Hello world!');}

functiondoSomething(){alert('Hello world!');}doSomething();

functiondoSomethingWithItems(items){vari,len,value=10,result=value+10;functiondoSomething(item){// 代码逻辑}for(i=0,len=items.length;i<len;i++){doSomething(items[i]);}}

// 不好的写法if(condition){functiondoSomething(){alert('hi');}}else{functiondoSomething(){alert('Yo');}}

函数调用间隔

// 好的写法doSomething(item);// 不好的写法：看起来像一个语句块doSomething(item);// 用来做对比的块语句while(item){// 代码逻辑}

立即调用的函数

// 一般的写法vardoSomething=function(){// 函数体};// 不好的写法 : 被误解为函数的赋值，其实是被赋值为一个对象varvalue=function(){// 函数体return{message:"Hi"}}();// 好的写法varvalue=(function(){// 函数体return{message:"Hi"}}());

严格模式

// 不好的写法 - 全局严格模式"use strict"functiondoSomething(){// 代码}// 好的写法functiondoSomething(){"use strict"// 代码}

// 好的写法(function(){"use strict"functiondoSomething(){// 代码}functiondoSomethingElse(){// 代码}})();

相等

// 比较数字5和字符串5console.log(5=="5");// true// 比较数字25和十六进制的字符串25console.log(25=="0x19");// true

// 数字 1 和 trueconsole.log(1==true);// true// 数字 0 和 falseconsole.log(0==false);// true// 数字 2 和 trueconsole.log(2==true);// false

varobject={toString:function(){return"0x19";}};console.log(object==25);// true

console.log(null==undefined);// true

// 比较数字5和字符串5console.log(5=="5");// trueconsole.log(5==="5");// false// 比较数字25和十六进制的字符串25console.log(25=="0x19");// trueconsole.log(25==="0x19");// false// 数字 1 和 trueconsole.log(1==true);// trueconsole.log(1===true);// false// 数字 0 和 falseconsole.log(0==false);// trueconsole.log(0===false);// false// 数字 2 和 trueconsole.log(2==true);// falseconsole.log(2===true);// falsevarobject={toString:function(){return"0x19";}};// 一个对象和25console.log(object==25);// trueconsole.log(object===25);// false// null和undefinedconsole.log(null==undefined);// trueconsole.log(null===undefined);// false

补足