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 相关文章推荐
jQuery 借助插件Lavalamp实现导航条动态美化效果
Sep 27 Javascript
js定时调用方法成功后并停止调用示例
Apr 08 Javascript
JS的事件绑定深入认识
Jun 26 Javascript
JavaScript实现按Ctrl键打开新页面
Sep 04 Javascript
node.js中的fs.open方法使用说明
Dec 17 Javascript
jQuery获取cookie值及删除cookie用法实例
Apr 15 Javascript
扩展jquery easyui tree的搜索树节点方法(推荐)
Oct 28 Javascript
微信小程序之MaterialDesign--input组件详解
Feb 15 Javascript
原生javascript实现分页效果
Apr 21 Javascript
vue非父子组件通信问题及解决方法
Jun 11 Javascript
浅谈JavaScript闭包
Apr 09 Javascript
vue-cli或vue项目利用HBuilder打包成移动端app操作
Jul 29 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
第十三节--对象串行化
2006/11/16 PHP
thinkPHP实现MemCache分布式缓存功能
2016/03/23 PHP
设定php简写功能的方法
2019/11/28 PHP
详解PHP中curl_multi并发的实现
2020/06/08 PHP
JavaScript 事件对象的实现
2009/07/13 Javascript
IE JS无提示关闭窗口不提示的方法
2010/04/29 Javascript
js 优化次数过多的循环 考虑到性能问题
2011/03/05 Javascript
Extjs EditorGridPanel中ComboBox列的显示问题
2011/07/04 Javascript
node.js中的fs.fsync方法使用说明
2014/12/15 Javascript
JavaScript中的fontsize()方法使用详解
2015/06/08 Javascript
jQuery使用模式窗口实现在主页面和子页面中互相传值的方法
2016/03/01 Javascript
WebSocket+node.js创建即时通信的Web聊天服务器
2016/08/08 Javascript
浅谈MVC+EF easyui dataGrid 动态加载分页表格
2016/11/10 Javascript
Vue.js实现图片的随意拖动方法
2018/03/08 Javascript
jQuery阻止事件冒泡实例分析
2018/07/03 jQuery
对vue下点击事件传参和不传参的区别详解
2018/09/15 Javascript
Vue自定义指令写法与个人理解
2019/02/09 Javascript
vue watch关于对象内的属性监听
2019/04/22 Javascript
Nodejs libuv运行原理详解
2019/08/21 NodeJs
用云开发Cloudbase实现小程序多图片内容安全监测的代码详解
2020/06/07 Javascript
Python tornado队列示例-一个并发web爬虫代码分享
2018/01/09 Python
Python使用numpy产生正态分布随机数的向量或矩阵操作示例
2018/08/22 Python
Python用61行代码实现图片像素化的示例代码
2018/12/10 Python
python截取两个单词之间的内容方法
2018/12/25 Python
浅谈pandas筛选出表中满足另一个表所有条件的数据方法
2019/02/08 Python
Pandas中resample方法详解
2019/07/02 Python
Python read函数按字节(字符)读取文件的实现
2019/07/03 Python
Python获取时间戳代码实例
2019/09/24 Python
python实现通过队列完成进程间的多任务功能示例
2019/10/28 Python
在PyCharm中遇到pip安装 失败问题及解决方案(pip失效时的解决方案)
2020/03/10 Python
CSS3 Columns分列式布局方法简介
2014/05/03 HTML / CSS
2014年房产销售工作总结
2014/12/08 职场文书
培养联系人考察意见
2015/06/01 职场文书
反邪教学习心得体会
2016/01/15 职场文书
ORACLE查看当前账号的相关信息
2021/06/18 Oracle
vue实现Toast组件轻提示
2022/04/10 Vue.js