js中将具有数字属性名的对象转换为数组


Posted in Javascript onMarch 06, 2011

虽然不太常用,但我们的确可以给对象添加以数字为属性名的属性:

var obj = {}; 
obj[0] = 1; 
obj[1] = 2;

这个对象并不是数组类型,那有没有办法把它转换为数组类型呢?jQuery代码中采用了Array.prototype.slice把这种对象转换为数组,但我试了好几遍,就是不行:
var obj = {}; 
obj[0] = 1; 
obj[1] = 2; 
alert(Array.prototype.slice.call(obj));

上面这段代码在IE下直接报错,在Firefox下虽然没有报错,输出内容却是空。也就说,转换失败了。这种内置方法的问题最好还是查查ECMA-262,slice方法的执行流程的前两步如下:
1. Let A be a new array created as if by the expression new Array(). 
2. Call the [[Get]] method of this object with argument "length".

这里提到了参数length。obj对象虽然有数字索引,但是却没有length属性。其实问题就在这:slice方法不知道这个对象的长度。简单修改一下代码,添加length属性:
var obj = {}; 
obj[0] = 1; 
obj[1] = 2; 
obj.length = 2; 
alert(Array.prototype.slice.call(obj));

输出内容是"1,2",复制成功。那是不是说明,只要调用slice方法的this有数字索引和length属性,就可以转换为数组呢?。

这个定律在大部分浏览器下成立。然而,在IE环境下,对于HtmlCollection这样的DOM元素集合,即使具有上述特征,它在调用slice的时候也会报错。

Javascript 相关文章推荐
javascript 进阶篇2 CSS XML学习
Mar 14 Javascript
JS获取鼠标坐标的实例方法
Jul 18 Javascript
浅谈JavaScript正则表达式分组匹配
Apr 10 Javascript
简介JavaScript中的sub()方法的使用
Jun 08 Javascript
Treegrid的动态加载实例代码
Apr 29 Javascript
JQuery点击事件回到页面顶部效果的实现代码
May 24 Javascript
原生js实现下拉框功能(支持键盘事件)
Jan 13 Javascript
jQuery内容筛选选择器实例代码
Feb 06 Javascript
详解webpack解惑:require的五种用法
Jun 09 Javascript
详解10分钟学会vue滚动行为
Sep 21 Javascript
用jQuery实现抽奖程序
Apr 12 jQuery
vue之封装多个组件调用同一接口的案例
Aug 11 Javascript
js 优化次数过多的循环 考虑到性能问题
Mar 05 #Javascript
淘宝搜索框效果实现分析
Mar 05 #Javascript
再论Javascript下字符串连接的性能
Mar 05 #Javascript
再论Javascript的类继承
Mar 05 #Javascript
Array的push与unshift方法性能比较分析
Mar 05 #Javascript
js定义对象或数组直接量时各浏览器对多余逗号的处理(json)
Mar 05 #Javascript
判断用户是否在线的代码
Mar 05 #Javascript
You might like
Notice: Undefined index: page in E:\PHP\test.php on line 14
2010/11/02 PHP
php实现数组中索引关联数据转换成json对象的方法
2015/07/08 PHP
php编程中echo用逗号和用点号连接的区别
2016/03/26 PHP
Laravel框架表单验证操作实例分析
2019/09/30 PHP
javascript vvorld 在线加密破解方法
2008/11/13 Javascript
在模板页面的js使用办法
2010/04/01 Javascript
JavaScript中实现块作用域的方法
2010/04/01 Javascript
jQuery实现的立体文字渐变效果
2010/05/17 Javascript
按钮JS复制文本框和表格的代码
2011/04/01 Javascript
如何设置iframe高度自适应在跨域情况下的可用方法
2013/09/06 Javascript
jquery中EasyUI使用技巧小结
2015/02/10 Javascript
js实现刷新iframe的方法汇总
2015/04/27 Javascript
利用jQuery实现WordPress中@的ID悬浮显示评论内容
2015/12/11 Javascript
Node.js的MongoDB驱动Mongoose基本使用教程
2016/03/01 Javascript
CKEditor无法验证的解决方案(js验证+jQuery Validate验证)
2016/05/09 Javascript
Bootstrap模块dropdown实现下拉框响应
2016/05/22 Javascript
原生态js,鼠标按下后,经过了那些单元格的简单实例
2016/08/11 Javascript
jQuery实现的省市联动菜单功能示例【测试可用】
2017/01/13 Javascript
详解vue组件通信的三种方式
2017/06/30 Javascript
JS实现简单获取最近7天和最近3天日期的方法
2018/04/18 Javascript
浅谈vue.use()方法从源码到使用
2019/05/12 Javascript
原生js+canvas实现贪吃蛇效果
2020/08/02 Javascript
[01:19]2014DOTA2国际邀请赛 采访TITAN战队ohaiyo 能赢DK很幸运
2014/07/12 DOTA
Python深入学习之装饰器
2014/08/31 Python
详解Python中with语句的用法
2015/04/15 Python
Python气泡提示与标签的实现
2020/04/01 Python
Expedia马来西亚旅游网站:廉价酒店,度假村和航班预订
2016/07/26 全球购物
比驿:全球酒店比价网
2018/06/20 全球购物
法拉利英国精品店:Ferraris Boutique UK
2019/07/20 全球购物
本科生求职简历的自我评价
2013/10/21 职场文书
小学生检讨书大全
2014/02/06 职场文书
国贸专业的职业规划书
2014/03/15 职场文书
岗位工作说明书
2014/07/29 职场文书
支部书记四风对照材料
2014/08/28 职场文书
2015年安全生产责任书
2015/01/30 职场文书
学习新党章心得体会2016
2016/01/15 职场文书