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 相关文章推荐
从QQ网站中提取的纯JS省市区三级联动菜单
Dec 25 Javascript
浅谈js函数中的实例对象、类对象、局部变量(局部函数)
Nov 20 Javascript
基于JS实现移动端左滑删除功能
Jul 28 Javascript
页面点击小红心js实现代码
May 26 Javascript
基于Vue+element-ui 的Table二次封装的实现
Jul 20 Javascript
基于jquery实现九宫格拼图小游戏
Nov 30 jQuery
JavaScript的级联函数用法简单示例【链式调用】
Mar 26 Javascript
基于AngularJS拖拽插件ngDraggable.js实现拖拽排序功能
Apr 02 Javascript
小程序实现简单语音聊天的示例代码
Jul 24 Javascript
基于Vue全局组件与局部组件的区别说明
Aug 11 Javascript
JS禁用右键、禁用Ctrl+u、禁用Ctrl+s、禁用F12的实现代码
Dec 01 Javascript
javascript实现固定侧边栏
Feb 09 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
xml+php动态载入与分页
2006/10/09 PHP
PHP结合Vue实现滚动底部加载效果
2017/12/17 PHP
PDO::getAvailableDrivers讲解
2019/01/28 PHP
限制textbox或textarea输入字符长度的JS代码
2013/10/16 Javascript
JS 新增Cookie 取cookie值 删除cookie 举例详解
2014/10/10 Javascript
javascript检测两个数组是否相似
2015/05/19 Javascript
jQuery实现文本框邮箱输入自动补全效果
2015/11/17 Javascript
JS获取文件大小方法小结
2015/12/08 Javascript
JavaScript程序开发之JS代码放置的位置
2016/01/15 Javascript
深入解析Javascript闭包的功能及实现方法
2016/07/10 Javascript
基于JavaScript实现自动更新倒计时效果
2016/12/19 Javascript
nodejs对express中next函数的一些理解
2017/09/08 NodeJs
详解react、redux、react-redux之间的关系
2018/04/11 Javascript
浅谈Webpack打包优化技巧
2018/06/12 Javascript
Nodejs技巧之Exceljs表格操作用法示例
2019/11/06 NodeJs
JS实现烟花爆炸效果
2020/03/10 Javascript
浅谈Vue 函数式组件的使用技巧
2020/06/16 Javascript
简单学习Python time模块
2016/04/29 Python
python多线程socket编程之多客户端接入
2017/09/12 Python
Python 2/3下处理cjk编码的zip文件的方法
2019/04/26 Python
python 随机生成10位数密码的实现代码
2019/06/27 Python
OpenCV 轮廓检测的实现方法
2019/07/03 Python
python中selenium操作下拉滚动条的几种方法汇总
2019/07/14 Python
django创建超级用户过程解析
2019/09/18 Python
python+mysql实现个人论文管理系统
2019/10/25 Python
python中从for循环延申到推导式的具体使用
2019/11/29 Python
使用TensorFlow搭建一个全连接神经网络教程
2020/02/06 Python
用python发送微信消息
2020/12/21 Python
详解Python中的Lock和Rlock
2021/01/26 Python
移动Web—CSS为Retina屏幕替换更高质量的图片
2012/12/24 HTML / CSS
详解通过变换矩阵实现canvas的缩放功能
2019/01/14 HTML / CSS
GUESS Factory加拿大:牛仔裤、服装及配饰
2019/09/20 全球购物
医生爱岗敬业演讲稿
2014/08/26 职场文书
2014年小学教师工作自我评价
2014/09/22 职场文书
婚前保证书范文
2015/02/28 职场文书
app场景下uniapp的扫码记录
2022/07/23 Java/Android