惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Hugging Face - Blog
Hugging Face - Blog
云风的 BLOG
云风的 BLOG
大猫的无限游戏
大猫的无限游戏
M
MIT News - Artificial intelligence
L
LangChain Blog
阮一峰的网络日志
阮一峰的网络日志
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
Recent Announcements
Recent Announcements
IT之家
IT之家
Google DeepMind News
Google DeepMind News
罗磊的独立博客
爱范儿
爱范儿
Last Week in AI
Last Week in AI
人人都是产品经理
人人都是产品经理
U
Unit 42
MongoDB | Blog
MongoDB | Blog
S
SegmentFault 最新的问题
B
Blog
博客园 - 叶小钗
月光博客
月光博客
Stack Overflow Blog
Stack Overflow Blog
V
Visual Studio Blog
C
Check Point Blog
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知

博客园 - 爱在戏院前

Unity的shader学习2 Unity的shader学习1 我的webgame戰鬥回放 gvim小操作 - 爱在戏院前 - 博客园 gvim2笔记 gvim笔记 如何保证网站的稳定性 开源了,开放我的仿ext控件集 122个常见问题收集整理(FLASH初学者参见) MYSQL性能优化(转) http协议全解释 Meta标签全解释 - 爱在戏院前 - 博客园 个人js作品集,仿ext风格(改) document.execcommand方法 科学利用时间,为了有效的生活 Javascript文档生成 Sqlite使用说明 表单Input的高级限制级用法 用JavaScript实现MD5,SHA1加密
JavaScript容易犯错的九个陷阱
爱在戏院前 · 2008-09-16 · via 博客园 - 爱在戏院前

以下是JavaScript容易犯错的九个陷阱。虽然不是什么很高深的技术问题,但注意一下,会使您的编程轻松些,即所谓make life easier. 以及对某些陷阱会混杂一些评点。
  1. 最后一个逗号

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

以下是引用片段:

Code

  2. this的引用会改变

  如这段代码:

以下是引用片段:
  <input type="button" value="Gotcha!" id="MyButton" >
      

Code

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

以下是引用片段:
  <input type="button" value="Gotcha!" id="theText" >
  

Code


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

  3. 标识盗贼

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

以下是引用片段:
  <input type="button" id="TheButton">
  <script>
  TheButton = get("TheButton");
  </script>


  IE会报对象未定义的错误。

  4. 字符串只替换第一个匹配

  如下代码:

以下是引用片段:
  <script>
  var fileName = "This is a title".replace(" ","_");
  </script>


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

以下是引用片段:
  var fileName = "This is a title".replace(/ /g,"_");


   5. mouseout意味着mousein

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

  6. parseInt是基于进制体系的

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

  7. for...in...会遍历所有的东西

  有一段这样的代码:

以下是引用片段:

Code

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

以下是引用片段:
  

Code


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

  8. 事件处理器的陷阱

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

以下是引用片段:
  YAHOO.util.Event.addListener(window, "click", MyOnClickMethod);


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

  9. Focus Pocus

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

以下是引用片段:
  var newInput = document.createElement("input");
  document.body.appendChild(newInput);
  newInput.focus();
  newInput.select();

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

以下是引用片段: 

Code

  在实践中,JavaScript的陷阱还有很多很多,大多是由于解析器的实现不到位而引起。

转自网上