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 Event学习第七章 事件属性
Feb 07 Javascript
解决jquery版本冲突的有效方法
Sep 02 Javascript
JS实现自动变化的导航菜单效果代码
Sep 09 Javascript
封装好的javascript前端分页插件pagination
Jan 04 Javascript
EasyUI加载完Html内容样式渲染完成后显示
Jul 25 Javascript
JavaScript三种绑定事件方式及相互之间的区别分析
Jan 10 Javascript
ES6新特性之类(Class)和继承(Extends)相关概念与用法分析
May 24 Javascript
微信小程序中如何计算距离某个节日还有多少天
Jul 15 Javascript
微信小程序 简易计算器实现代码实例
Sep 02 Javascript
vue-form表单验证是否为空值的实例详解
Oct 29 Javascript
从0搭建vue-cli4脚手架
Jun 17 Javascript
vue实现下载文件流完整前后端代码
Nov 17 Vue.js
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
PHP实现变色验证码实例
2014/01/06 PHP
PHP iconv()函数字符编码转换的问题讲解
2019/03/22 PHP
使用tp框架和SQL语句查询数据表中的某字段包含某值
2019/10/18 PHP
laravel 实现关闭CSRF(全部关闭、部分关闭)
2019/10/21 PHP
静态的动态续篇之来点XML
2006/08/15 Javascript
Firefox div高度自适应
2009/04/28 Javascript
jquery属性选择器not has怎么写 行悬停高亮显示
2013/11/13 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
2013/12/19 Javascript
js实现touch移动触屏滑动事件
2015/04/17 Javascript
jQuery插件kinMaxShow扩展效果用法实例
2015/05/04 Javascript
js获取所有checkbox的值的简单实例
2016/05/30 Javascript
jquery 实现回车登录详解及实例代码
2016/10/23 Javascript
vue2.0父子组件及非父子组件之间的通信方法
2017/01/21 Javascript
easyui-datagrid特殊字符不能显示的处理方法
2017/04/12 Javascript
javascript实现Java中的Map对象功能的实例详解
2017/08/21 Javascript
JS实现数组简单去重及数组根据对象中的元素去重操作示例
2018/01/05 Javascript
vue.js实现插入数值与表达式的方法分析
2018/07/06 Javascript
vue js秒转天数小时分钟秒的实例代码
2018/08/08 Javascript
微信小程序实现form表单本地储存数据
2019/06/27 Javascript
Vue使用路由钩子拦截器beforeEach和afterEach监听路由
2020/11/16 Javascript
使用Python的Twisted框架编写简单的网络客户端
2015/04/16 Python
Python基于OpenCV实现视频的人脸检测
2018/01/23 Python
tensorflow实现简单的卷积神经网络
2018/05/24 Python
Python自定义一个异常类的方法
2019/06/27 Python
TensorFlow自定义损失函数来预测商品销售量
2020/02/05 Python
Python sqlite3查询操作过程解析
2020/02/20 Python
Python3.8安装Pygame教程步骤详解
2020/08/14 Python
THE OUTNET英国官网:国际设计师品牌折扣网站
2016/08/14 全球购物
全球最大的游戏市场:G2A
2018/07/05 全球购物
Guess欧洲官网:美国服饰品牌
2019/08/06 全球购物
元旦联欢会主持词
2014/03/26 职场文书
岗位职责说明书
2014/05/07 职场文书
关于感恩的演讲稿400字
2014/08/26 职场文书
2015年酒店客房部工作总结
2015/04/25 职场文书
建党伟业观后感
2015/06/01 职场文书
你离财务总监还有多远?速览CFO的岗位职责
2019/11/18 职场文书