JavaScript的9个陷阱及评点分析

 更新时间:2008年05月16日 22:46:21   作者:  
以下是JavaScript容易犯错的九个陷阱。虽然不是什么很高深的技术问题,但注意一下,会使您的编程轻松些,即所谓make life easier. 笔者对某些陷阱会混杂一些评点。
1. 最后一个逗号

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

<script>
  var theObj = {
        city : "Boston",
        state : "MA",
  }
</script> 
2. 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作用域的问题。如果你看过,你会发现解决方案不止一种。

3. 标识盗贼

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

<input type="button" id="TheButton">
<script>
    TheButton = get("TheButton");
</script>
IE会报对象未定义的错误。我只能说:IE sucks.

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,"_");

相关文章

  • 实现div可编辑的常见方法总结

    实现div可编辑的常见方法总结

    实现div可编辑的常见方法总结...
    2007-04-04
  • 使用BootStrap实现标签切换原理解析

    使用BootStrap实现标签切换原理解析

    本文给大家分享使用BootStrap实现标签切换原理解析及核心代码,需要的朋友参考下
    2017-03-03
  • 详解JS变量存储深拷贝和浅拷贝

    详解JS变量存储深拷贝和浅拷贝

    这篇文章主要介绍了JS变量存储深拷贝和浅拷贝,想深入了解JS的同学,可以参考下
    2021-05-05
  • JS的IE和Firefox兼容性集锦

    JS的IE和Firefox兼容性集锦

    JS的IE和Firefox兼容性集锦...
    2006-12-12
  • 在vue中为什么不能用index作为key

    在vue中为什么不能用index作为key

    这篇文章主要介绍了在vue中为什么不能用index作为key,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下
    2022-09-09
  • 整理Javascript函数学习笔记

    整理Javascript函数学习笔记

    整理Javascript函数学习笔记,之前一系列的文章是跟我学习Javascript,本文就是进一步学习Javascript函数,希望大家继续关注
    2015-12-12
  • webpack模块化的原理解析

    webpack模块化的原理解析

    webpack 中实现模块化的核心就是 __webpack_require__ 函数,无论是commonjs模块化还是es 模块都是通过该函数来导入的,这篇文章主要介绍了webpack模块化的原理,需要的朋友可以参考下
    2023-02-02
  • uniapp项目使用防抖及节流的方案实战

    uniapp项目使用防抖及节流的方案实战

    防抖就是指触发事件后把触发非常频繁的事件合并成一次去执行,节流是指频繁触发事件时只会在指定的时间段内执行事件回调,即触发事件间隔大于等于指定的时间才会执行回调函数,这篇文章主要给大家介绍了关于uniapp项目使用防抖及节流的相关资料,需要的朋友可以参考下
    2023-01-01
  • Javascript 数组添加一个 indexOf 方法的实现代码

    Javascript 数组添加一个 indexOf 方法的实现代码

    Javascript 的字符串有个 indexOf 的方法,能够返回字符在指定的字符串中的位置,非常有用,本文介绍了如何给 Javascript 数组也添加一个类似的方法。
    2009-09-09
  • 详解Webpack抽离第三方类库以及common解决方案

    详解Webpack抽离第三方类库以及common解决方案

    这篇文章主要介绍了详解Webpack抽离第三方类库以及common解决方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-03-03

最新评论