JavaScript的9个陷阱及评点分析


Posted in Javascript onMay 16, 2008

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

Javascript 相关文章推荐
img的onload的另类用法
Jan 10 Javascript
Javascript中定义方法的另类写法(批量定义js对象的方法)
Feb 25 Javascript
javascript中关于break,continue的特殊用法与介绍
May 24 Javascript
Jquery 数据选择插件Pickerbox使用介绍
Aug 24 Javascript
分享12个实用的jQuery代码片段
Mar 09 Javascript
JS函数定义方式的区别介绍
Mar 22 Javascript
ES6中Generator与异步操作实例分析
Mar 31 Javascript
深入理解vue Render函数
Jul 19 Javascript
详解webpack2+React 实例demo
Sep 11 Javascript
微信小程序picker组件简单用法示例【附demo源码下载】
Dec 05 Javascript
js实现打字小游戏
Dec 17 Javascript
vue props default Array或是Object的正确写法说明
Jul 30 Javascript
认识延迟时间为0的setTimeout
May 16 #Javascript
用函数式编程技术编写优美的 JavaScript_ibm
May 16 #Javascript
Javascript模块模式分析
May 16 #Javascript
Dom加载让图片加载完再执行的脚本代码
May 15 #Javascript
直接生成打开窗口代码,不必下载
May 14 #Javascript
地震发生中逃生十大法则
May 12 #Javascript
通过修改referer下载文件的方法
May 11 #Javascript
You might like
用libtemplate实现静态网页生成
2006/10/09 PHP
浅析ThinkPHP中execute和query方法的区别
2014/06/13 PHP
PHP 读取和编写 XML
2014/11/19 PHP
php封装json通信接口详解及实例
2017/03/07 PHP
Laravel中为什么不使用blpop取队列详析
2018/08/01 PHP
PHP PDOStatement::errorCode讲解
2019/01/31 PHP
javascript 延迟加载技术(lazyload)简单实现
2011/01/17 Javascript
JS获取各种宽度、高度的简单介绍
2014/12/19 Javascript
JavaScript实现的多个图片广告交替显示效果代码
2015/09/04 Javascript
判断JS对象是否拥有某属性的方法推荐
2016/05/12 Javascript
原生JS下拉加载插件分享
2016/12/26 Javascript
JS解决IOS中拍照图片预览旋转90度BUG的问题
2017/09/13 Javascript
vue基于Element构建自定义树的示例代码
2017/09/19 Javascript
微信小程序发布新版本时自动提示用户更新的方法
2019/06/07 Javascript
jquery弹窗时禁止body滚动条滚动的例子
2019/09/21 jQuery
在vue中配置不同的代理同时访问不同的后台操作
2020/09/11 Javascript
vue 解决mintui弹窗弹起来,底部页面滚动bug问题
2020/11/12 Javascript
python 中字典嵌套列表的方法
2018/07/03 Python
解决pyinstaller打包exe文件出现命令窗口一闪而过的问题
2018/10/31 Python
Python创建一个空的dataframe,并循环赋值的方法
2018/11/08 Python
Python hexstring-list-str之间的转换方法
2019/06/12 Python
Python使用Turtle库绘制一棵西兰花
2019/11/23 Python
python支持多继承吗
2020/06/19 Python
如何将json数据转换为python数据
2020/09/04 Python
python3 os进行嵌套操作的实例讲解
2020/11/19 Python
pycharm激活码2020最新分享适用pycharm2020最新版亲测可用
2020/11/22 Python
Python实现钉钉/企业微信自动打卡的示例代码
2021/02/02 Python
全球知名提供各类营养保健品的零售商:Vitamin Shoppe
2016/10/09 全球购物
五年级科学教学反思
2014/02/05 职场文书
艺术教育实施方案
2014/05/03 职场文书
2015年财政所工作总结
2015/04/25 职场文书
毕业欢送晚会主持词
2019/06/25 职场文书
详解python的内存分配机制
2021/05/10 Python
日本十大血腥动漫,那些被禁播的动漫盘点
2022/03/21 日漫
python神经网络学习 使用Keras进行简单分类
2022/05/04 Python
AndroidStudio图片压缩工具ImgCompressPlugin使用实例
2022/08/05 Java/Android