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 相关文章推荐
JAVASCRIPT  THIS详解 面向对象
Mar 25 Javascript
Jquery练习之表单验证实现代码
Dec 14 Javascript
jQuery设置与获取HTML,文本和值的简单实例
Feb 26 Javascript
js获取url中&quot;?&quot;后面的字串方法
May 15 Javascript
js中函数声明与函数表达式
Jun 03 Javascript
js表单验证实例讲解
Mar 31 Javascript
Bootstrap每天必学之弹出框(Popover)插件
Apr 25 Javascript
jQuery 表单序列化实例代码
Jun 11 jQuery
vue中轮训器的使用
Jan 27 Javascript
微信小程序使用echarts获取数据并生成折线图
Oct 16 Javascript
JavaScript 异步时序问题
Nov 20 Javascript
vue中控制mock在开发环境使用,在生产环境禁用方式
Apr 06 Vue.js
认识延迟时间为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
双料怀旧--SHARP GF515的维护、修理和简单调试
2021/03/02 无线电
WIN98下Apache1.3.14+PHP4.0.4的安装
2006/10/09 PHP
PHP的Yii框架中Model模型的学习教程
2016/03/29 PHP
PHP如何读取由JavaScript设置的Cookie
2017/03/22 PHP
php命令行模式代码实例详解
2021/02/26 PHP
禁止页面刷新让F5快捷键及右键都无效
2014/01/22 Javascript
js 数组操作之pop,push,unshift,splice,shift
2014/01/29 Javascript
AngularJS语法详解(续)
2015/01/23 Javascript
一种基于浏览器的自动小票机打印实现方案(js版)
2016/07/26 Javascript
Node.js配合node-http-proxy解决本地开发ajax跨域问题
2016/08/31 Javascript
浅析$(function) ready和onload 的区别
2016/09/03 Javascript
详解JavaScript权威指南之对象
2016/09/27 Javascript
BootStrap selectpicker后台动态绑定数据
2017/06/01 Javascript
微信小程序实现留言板功能
2018/11/02 Javascript
详解Vue依赖收集引发的问题
2019/04/22 Javascript
JavaScript函数式编程(Functional Programming)箭头函数(Arrow functions)用法分析
2019/05/22 Javascript
使用Vue.set()方法实现响应式修改数组数据步骤
2019/11/09 Javascript
基于JavaScript实现贪吃蛇游戏
2020/03/16 Javascript
Webpack3+React16代码分割的实现
2021/03/03 Javascript
详解Django框架中用context来解析模板的方法
2015/07/20 Python
Python使用Paramiko模块编写脚本进行远程服务器操作
2016/05/05 Python
Python实现代码统计工具(终极篇)
2016/07/04 Python
在python的类中动态添加属性与生成对象
2016/09/17 Python
Python实现读取文件最后n行的方法
2017/02/23 Python
TensorFlow Autodiff自动微分详解
2020/07/06 Python
简单聊聊H5的pushState与replaceState的用法
2018/04/03 HTML / CSS
AmazeUI的下载配置与Helloworld的实现
2020/08/19 HTML / CSS
AJAX都有哪些有点和缺点
2012/11/03 面试题
Python面试题:Python是如何进行内存管理的
2014/08/04 面试题
Overload和Override的区别
2012/09/02 面试题
2014年迎新年联欢会活动策划方案
2014/02/26 职场文书
公司租车协议书
2015/01/29 职场文书
网络销售员岗位职责
2015/04/11 职场文书
2016年中秋节寄语大全
2015/12/07 职场文书
外出考察学习心得体会
2016/01/18 职场文书
靠谱准确的求职信
2019/04/02 职场文书