知识大全 JavaScript的9个陷阱及评点

Posted 2022-07-20 知

篇首语：不患人之不己知，患不知人也。本文由小常识网(cha138.com)小编为大家整理，主要介绍了知识大全 JavaScript的9个陷阱及评点相关的知识，希望对你有一定的参考价值。

JavaScript的9个陷阱及评点 以下文字资料是由(全榜网网www.cha138.com)小编为大家搜集整理后发布的内容，让我们赶快一起来看一下吧！

　　来自 Nine Javascript Gotchas 以下是JavaScript容易犯错的九个陷阱虽然不是什么很高深的技术问题但注意一下会使您的编程轻松些即所谓make life easier 笔者对某些陷阱会混杂一些评点

　　　最后一个逗号

　　如这段代码注意最后一个逗号按语言学角度来说应该是不错的（python的类似数据类型辞典dictionary就允许如此） IE会报语法错误但语焉不详你只能用人眼从几千行代码中扫描

　　<script> var theObj = city : Boston state : MA </script>

　　　this的引用会改变

　　如这段代码

　　<input type= button value= Gotcha! id= MyButton ><script>var MyObject = function () this alertMessage = Javascript rules ; this ClickHandler = function() alert(this alertMessage ); ();document getElementById( theText ) onclick = MyObject ClickHandler</script>

　　并不如你所愿答案并不是 JavaScript rules 在执行MyObject ClickHandler时代码中红色这行 this的引用实际上指向的是document getElementById( theText )的引用可以这么解决

　　<input type= button value= Gotcha! id= theText ><script>var MyObject = function () var self = this; this alertMessage = Javascript rules ; this OnClick = function() alert(self value); ();document getElementById( theText ) onclick = MyObject OnClick</script>

　　实质上这就是JavaScript作用域的问题如果你看过你会发现解决方案不止一种

　　　标识盗贼

　　在JavaScript中不要使用跟HTML的id一样的变量名如下代码

　　<input type= button id= TheButton ><script> TheButton = get( TheButton );</script>

　　IE会报对象未定义的错误我只能说 IE sucks

　　　字符串只替换第一个匹配

　　如下代码

　　<script> var fileName = This is a title replace( _ );</script>

　　而实际上结果是 This_is a title 在JavaScript中 String replace的第一个参数应该是正则表达式所以正确的做法是这样

　　var fileName = This is a title replace(/ /g _ );

　　　mouseout意味着mousein

　　事实上这是由于事件冒泡导致的 IE中有mouseenter和mouseleave 但不是标准的作者在此建议大家使用库比如YUI来解决问题

　　　parseInt是基于进制体系的

　　这个是常识可是很多人给忽略了parseInt还有第二个参数用以指明进制比如 parseInt( ) 如果你认为答案是那就错了因为在此字符串以开头 parseInt以八进制来处理它在八进制中是非法返回false 布尔值false转化成数值就是因此正确的做法是parseInt( )

　for in 会遍历所有的东西

　　有一段这样的代码

　　var arr = [ ]var total = ;for ( var x in arr) total = total * arr[x];

　　运行得好好的不是吗？但是有一天它不干了给我返回的值变成了NaN 晕我只不过引入了一个库而已啊原来是这个库改写了Array的prototype 这样我们的arr平白无过多出了一个属性（方法）而for in 会把它给遍历出来所以这样做才是比较安全的

　　for ( var x = ; x < arr length; x++) total = total * arr[x];

　　其实这也是污染基本类的prototype会带来危害的一个例证

　　　事件处理器的陷阱

　　这其实只会存在使用作为对象属性的事件处理器才会存在的问题比如window onclick = MyOnClickMethod这样的代码这会复写掉之前的window onclick事件还可能导致IE的内容泄露（sucks again）在IE还没有支持DOM 的事件注册之前作者建议使用库来解决问题比如使用YUI:

　　YAHOO util Event addListener(window click MyOnClickMethod);

　　这应该也属于常识问题但新手可能容易犯错

　　　Focus Pocus

　　新建一个input文本元素然后把焦点挪到它上面按理说这样的代码应该很自然

　　var newInput = document createElement( input );document body appendChild(newInput);newInput focus();newInput select();

　　但是IE会报错（sucks again and again）理由可能是当你执行fouce()的时候元素尚未可用因此我们可以延迟执行

var newInput = document createElement( input );newInput id = TheNewInput ;document body appendChild(newInput);setTimeout(function() //这里我使用闭包改写过若有兴趣可以对比原文 document getElementById( TheNewInput ) focus(); document getElementById( TheNewInput ) select(); ); cha138/Article/program/Java/JSP/201311/19388