JavaScript最新实战技巧.doc

JavaScript最新实战技巧摘要：JavaScript是一门非常流行的编程语言，许多开发者都会把JavaScript选为入门语言，本文向大家分享JavaScript开发的小技巧、最佳实践等非常实用的内容。在前段时间，CSDN研发频道发表了超实用的JavaScript技巧及最佳实践（上），很多开发者都觉得里面所提到的技巧非常实用，基于此，我们再向大家推荐超实用的JavaScript技巧及最佳实践（下），希望对大家有所帮助。文中所提供的代码片段都已经过最新版的Chrome 30测试，该浏览器使用V8 JavaScript引擎（V8 5）。1.使用逻辑符号&或者|进行条件判断jsview plaincopy1. varfoo=10;2. foo=10&doSomething();/isthesamethingasif(foo=10)doSomething();3. foo=5|doSomething();/isthesamethingasif(foo!=5)doSomething();AND也可以用来设置函数参数的默认值jsview plaincopy1. FunctiondoSomething(arg1)2. Arg1=arg1|10;/arg1willhave10asadefaultvalueifitsnotalreadyset3. 2.使用map()方法来遍历数组jsview plaincopy1. varsquares=1,2,3,4.map(function(val)2. returnval*val;3. );4. /squareswillbeequalto1,4,9,163.舍入小数位数jsview plaincopy1. varnum=2.443242342;2. num=num.toFixed(4);/numwillbeequalto2.44324.浮点数问题jsview plaincopy1. 0.1+0.2=0.3/isfalse2. 9007199254740992+1/isequalto90071992547409923. 9007199254740992+2/isequalto90071992547409940.1+0.2等于0.30000000000000004，为什么会发生这种情况？根据IEEE754标准，你需要知道的是所有JavaScript数字在64位二进制内的都表示浮点数。开发者可以使用toFixed()和toPrecision()方法来解决这个问题。5.使用for-in loop检查遍历对象属性下面这段代码主要是为了避免遍历对象属性。jsview plaincopy1. for(varnameinobject)2. if(object.hasOwnProperty(name)3. /dosomethingwithname4. 5. 6.逗号操作符jsview plaincopy1. vara=0;2. varb=(a+,99);3. console.log(a);/awillbeequalto14. console.log(b);/bisequalto997.计算或查询缓存变量在使用jQuery选择器的情况下，开发者可以缓存DOM元素jsview plaincopy1. varnavright=document.querySelector(#right);2. varnavleft=document.querySelector(#left);3. varnavup=document.querySelector(#up);4. varnavdown=document.querySelector(#down);8.在将参数传递到isFinite()之前进行验证jsview plaincopy1. isFinite(0/0);/false2. isFinite(foo);/false3. isFinite(10);/true4. isFinite(10);/true5. isFinite(undifined);/false6. isFinite();/false7. isFinite(null);/true!9.在数组中避免负向索引jsview plaincopy1. varnumbersArray=1,2,3,4,5;2. varfrom=numbersArray.indexOf(foo);/fromisequalto-13. numbersArray.splice(from,2);/willreturn5确保参数传递到indexOf()方法里是非负向的。10.（使用JSON）序列化和反序列化jsview plaincopy1. varperson=name:Saad,age:26,department:ID:15,name:R&D;2. varstringFromPerson=JSON.stringify(person);3. /*stringFromPersonisequaltoname:Saad,age:26,department:ID:15,name:R&D*/4. varpersonFromString=JSON.parse(stringFromPerson);5. /*personFromStringisequaltopersonobject*/11.避免使用eval()或Function构造函数eval()和Function构造函数被称为脚本引擎，每次执行它们的时候都必须把源码转换成可执行的代码，这是非常昂过的操作。jsview plaincopy1. varfunc1=newFunction(functionCode);2. varfunc2=eval(functionCode);12.避免使用with()方法如果在全局区域里使用with()插入变量，那么，万一有一个变量名字和它名字一样，就很容易混淆和重写。13.避免在数组里使用for-in loop而不是这样用：jsview plaincopy1. varsum=0;2. for(variinarrayNumbers)3. sum+=arrayNumbersi;4. 这样会更好：jsview plaincopy1. varsum=0;2. for(vari=0,len=arrayNumbers.length;ilen;i+)3. sum+=arrayNumbersi;4. 这样会更快：jsview plaincopy1. for(vari=0;i=50):8. category=Old;9. break;10. case(age=20):11. category=Baby;12. break;13. default:14. category=Young;15. break;16. ;17. returncategory;18. 19. getCategory(5);/willreturnBaby17.创建一个对象，该对象的属性是一个给定的对象可以编写一个这样的函数，创建一个对象，该对象属性是一个给定的对象，好比这样：jsview plaincopy1. functionclone(object)2. functionOneShotConstructor();3. OneShotCtotype=object;4. returnnewOneShotConstructor();5. 6. clone(Array).prototype;/18.一个HTML escaper函数jsview plaincopy1. functionescapeHTML(text)2. varreplacements=:,&:&,:;3. returntext.replace(/&/g,function(character)4. returnreplacementscharacter;5. );6. 19.在一个loop里避免使用try-catch-finallytry-catch-finally在当前范围里运行时会创建一个新的变量，在执行catch时，捕获异常对象会赋值给变量。不要这样使用：jsview plaincopy1. varobject=foo,bar,i;2. for(i=0,len=object.length;ilen;i+)3. try4. /dosomethingthatthrowsanexception5. 6. catch(e)7. /handleexception8. 9. 应该这样使用：jsview plaincopy1. varobject=foo,bar,i;2. try3. for(i=0,len=object.length;ilen;i+)4. /dosomethingthatthrowsanexception5. 6. 7. catch(e)8. /handleexception9. 20.给XMLHttpRequests设置timeouts如果一个XHR需要花费太长时间，你可以终止链接（例如网络问题），通过给XHR使用setTimeout()解决。jsview plaincopy1. varxhr=newXMLHttpRequest();2. xhr.onreadystatechange=function()3. if(this.readyState=4)4. clearTimeout(timeout);5. /dosomethingwithresponsedata6. 7. 8. vartimeout=setTimeout(function()9. xhr.abort();/callerrorcallback10. ,60*1000/*timeoutafteraminute*/);11. xhr.open(GET,url,true);12. 13. xhr.send();此外，通常你应该完全避免同步Ajax调用。21.处理WebSocket超时一般来说，当创建一个WebSocket链接时，服务器可能在闲置30秒后链接超时，在闲置一段时间后，防火墙也可能会链接超时。为了解决这种超时问题，你可以定期地向服务器发送空信息，在代码里添加两个函数：一个函数用来保持链接一直是活的，另一个用来取消链接是活的，使用这种方法，你将控制超时问题。添加一个timeIDjsview plaincopy1. vartimerID=0;2. functionkeepAlive()3. vartimeout=15000;4. if(webSocket.readyState=webSocket.OPEN)5. webSocket.send();6. 7. timerId=setTimeout(keepAlive,timeout);8. 9. functioncancelKeepAlive()10. if(timerId)11. cancelTimeout(timerId);12. 13. keepAlive()方法应该添加在WebSocket链接方法onOpen()的末端，cancelKeepAlive()方法放在onClose()方法下面。22.记住，