JavaScript中常见陷阱小结


Posted in Javascript onApril 27, 2010

你所创建的所有函数都是区分大小写的
单引号('字符串')和双引号("字符串")在JavaScript中没有特殊的区别,都可以用来创建字符串.但作为一般原则,大多数WEB开发者都选择使用单引号 而不是双引号,因为XHTML规范要求所有XHTML属性值都必须使用双引号括起来.

JavaScript不支持重载,在JavaScript中,脚本在执行时不会顾及函数定义时的参数,而是直接使用在作用域链中最后定义的那个函数。这意味着,相同名称的函数永远只存在一个实例

闭包是与作用域相关的一个概念,它指的是内部函数即使在外部函数执行完成并终止后,依然可以访问其外部函数的属性。当引用一个变量或方法时,JavaScript会沿着由对象执行路径构成使用域链对使用域进行解析,查找变量最近定义的值,一旦找到即使用该值。function initAnchors(event){

for (var i=1; i <=3; i++){ 


var anchor = document.GetElementById('anchor' + i); 


anchor.attachEvent('onclick', function() {  


alert('my id is anchor' + i); 


}); 

} 
}

假设页面中有三个A元素,ID分别为anchor1到anchor3,程序为三个A元素注册onclick事件,单击第个A元素显示"my id is anchorX",但实际运行情况却不是这样,单击每个A元素都显示"my id is anchor4"。为什么会这样呢,因为i的值实际上是在单击事件发生时才从使用域链中取得的,当单击事件发生时,initAnchors()已执行完毕,此时i的值等于4。解决方法可以按如下
function registerAnchorListner(anchor,i){ 
anchor.attachEvent('onclick', function() {  


alert('my id is anchor' + i); 

}
 
} 
function initAnchors(event){ 

for (var i=1; i <=3; i++){ 


var anchor = document.GetElementById('anchor' + i); 


registerAnchorListner(anchor,i); 

} 
} 
var anchor = document.GetElementById('anchor' + i); 
anchor.attachEvent('onclick', function() { 
alert('my id is anchor' + i); 

});

迭代对象,在编写脚本时经常使用到迭代,如下:

var list = [1,2,3,4]; 
for(var i = 0;i < list.length; i++){ 
alert(list); 
}

另一种可供选择的迭代方法是使用for循环遍历位于(in)list中的每个属性:
for(var i in list){ 
alert(list); 
}

此时,得到的是与使用前一迭代方法相同的结果,因为list是一个Array对象。

但是,当使用for(var i in item)方法操纵类似数组而又不是数组的对象时一定要格外小心,如下

var all=document.getElementsByTagName('*'); 
for(var i in all){ 
//对照all元素进行某些操作 
}

在这次的迭代过程中,i的值会分别等于length、item和namedItem,而这很可能会导致代码中出现意外错误。在某些情况下,可以使用对象的hasOwnProperty()方法来避免这个问题。如果对象的属性或方法是非继承的,那么hasOwnProperty()方法返回true。即这里的检查不涉及从其它对象继承的属性和方法,只会检查在特定对象自身中直接创建的属性,比如分配给数组的元素。因此,在如果在for循环中使用这种检查,那么循环将会跳过length这样属性,因为length不是数组all的真系属性,而是从派生数组all的NameNodeMap对象中继承的属性
var all=document.getElementsByTagName('*'); 
for(var i in all){ 
if(!all.hasOwnProperty(i)) continue; 

//对照all元素进行某些操作 
}
Javascript 相关文章推荐
JS文本框不能输入空格验证方法
Mar 19 Javascript
jQuery实现新消息闪烁标题提示的方法
Mar 11 Javascript
JavaScript控制两个列表框listbox左右交换数据的方法
Mar 18 Javascript
你真的了解BOM中的history对象吗
Feb 13 Javascript
axios基本入门用法教程
Mar 25 Javascript
vue2.x select2 指令封装详解
Oct 12 Javascript
AngularJS实时获取并显示密码的方法
Feb 06 Javascript
jQuery解析json格式数据示例
Sep 01 jQuery
layui多iframe页面控制定时器运行的方法
Sep 05 Javascript
JavaScript交换变量常用4种方法解析
Sep 02 Javascript
一小时迅速入门Mybatis之bind与多数据源支持 Java API
Sep 15 Javascript
vue自定义右键菜单之全局实现
Apr 09 Vue.js
javascript 动态修改样式和层叠样式表代码
Apr 27 #Javascript
js 绑定带参数的事件以及手动触发事件
Apr 27 #Javascript
javascript 模式设计之工厂模式学习心得
Apr 27 #Javascript
defer属性导致引用JQuery的页面报“浏览器无法打开网站xxx,操作被中止”错误的解决方法
Apr 27 #Javascript
jQuery Lightbox 图片展示插件使用说明
Apr 25 #Javascript
jQuery 表格工具集
Apr 25 #Javascript
基于JQuery.timer插件实现一个计时器
Apr 25 #Javascript
You might like
php下使用SMTP发邮件的代码
2008/01/10 PHP
ThinkPHP公共配置文件与各自项目中配置文件组合的方法
2014/11/24 PHP
php获取远程文件大小
2015/10/20 PHP
PHP加密解密函数详解
2015/10/28 PHP
PHP7 foreach() 函数修改
2021/03/09 PHP
javascript 操作文件 实现方法小结
2009/07/02 Javascript
Jquery遍历Json数据的方法
2015/04/20 Javascript
JS与jQ读取xml文件的方法
2015/12/08 Javascript
js获取浏览器的各种属性
2017/04/27 Javascript
vue Element-ui input 远程搜索与修改建议显示模版的示例代码
2017/10/19 Javascript
layui 表格操作列按钮动态显示的实现方法
2019/09/06 Javascript
[02:38]DOTA2亚洲邀请赛小组赛精彩集锦:Wings完美团击溃对手
2017/03/29 DOTA
[02:51]DOTA2 Supermajor小组分组对阵抽签仪式
2018/06/01 DOTA
[02:28]PWL开团时刻DAY3——Ink Ice与DeMonsTer之间的勾心斗角
2020/11/03 DOTA
利用Django框架中select_related和prefetch_related函数对数据库查询优化
2015/04/01 Python
python使用logging模块发送邮件代码示例
2018/01/18 Python
python使用Tkinter实现在线音乐播放器
2018/01/30 Python
详解Python中is和==的区别
2019/03/21 Python
Python supervisor强大的进程管理工具的使用
2019/04/24 Python
tensorflow 环境变量设置方式
2020/02/06 Python
win10安装python3.6的常见问题
2020/07/01 Python
Python如何设置指定窗口为前台活动窗口
2020/08/12 Python
怎么解决pycharm license Acti的方法
2020/10/28 Python
Python批量删除mysql中千万级大量数据的脚本分享
2020/12/03 Python
python在协程中增加任务实例操作
2021/02/28 Python
一款html5 canvas实现的图片玻璃碎片特效
2014/09/11 HTML / CSS
html5 canvas的绘制文本自动换行的示例代码
2018/09/17 HTML / CSS
英国时尚运动品牌的合集:The Sports Edit
2017/12/20 全球购物
物流专业大学生的自我鉴定
2013/11/13 职场文书
报告会主持词
2014/04/02 职场文书
检查机关党的群众路线个人整改措施
2014/10/04 职场文书
审美与表现自我评价
2015/03/09 职场文书
2015年后勤工作总结范文
2015/04/08 职场文书
离婚案件被告代理词
2015/05/23 职场文书
2015国庆节感想
2015/08/04 职场文书
《小小的船》教学反思
2016/02/18 职场文书