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 相关文章推荐
jqPlot Option配置对象详解
Jul 25 Javascript
jQuery中对未来的元素绑定事件用bind、live or on
Apr 17 Javascript
js如何判断用户是在PC端和还是移动端访问
Apr 24 Javascript
node.js中的console.log方法使用说明
Dec 09 Javascript
详解Angularjs中的依赖注入
Mar 11 Javascript
bootstrap模态框消失问题的解决方法
Dec 02 Javascript
vue中如何引入jQuery和Bootstrap
Apr 10 jQuery
Node之简单的前后端交互(实例讲解)
Nov 14 Javascript
开发Vue树形组件的示例代码
Dec 21 Javascript
JS实现运动缓冲效果的封装函数示例
Feb 18 Javascript
微信小程序实现点赞、取消点赞功能
Nov 02 Javascript
vue3如何优雅的实现移动端登录注册模块
Mar 29 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/12/30 PHP
PHP设计模式之观察者模式实例
2016/02/22 PHP
php版微信自动获取收货地址api用法示例
2016/09/22 PHP
PHP dirname功能及原理实例解析
2020/10/28 PHP
JavaScript flash复制库类 Zero Clipboard
2011/01/17 Javascript
jQuery前台数据获取实现代码
2011/03/16 Javascript
一个关于jqGrid使用的小例子(行按钮)
2011/11/04 Javascript
jQuery实现鼠标滑过Div层背景变颜色的方法
2015/02/17 Javascript
JavaScript实现列表分页功能特效
2015/05/15 Javascript
JavaScript通过代码调用Flash显示的方法
2016/02/02 Javascript
Bootstrap~多级导航(级联导航)的实现效果【附代码】
2016/03/08 Javascript
Javascript基于jQuery UI实现选中区域拖拽效果
2016/11/25 Javascript
简单实现jQuery手风琴效果
2017/08/18 jQuery
利用Console来Debug的10个高级技巧汇总
2018/03/26 Javascript
vue 中的 render 函数作用详解
2020/02/28 Javascript
autojs 蚂蚁森林能量自动拾取即给指定好友浇水的实现方法
2020/05/03 Javascript
python重试装饰器示例
2014/02/11 Python
python根据距离和时长计算配速示例
2014/02/16 Python
在Django中管理Users和Permissions以及Groups的方法
2015/07/23 Python
Python 获得命令行参数的方法(推荐)
2018/01/24 Python
用python实现刷点击率的示例代码
2019/02/21 Python
Python实现生成密码字典的方法示例
2019/09/02 Python
python函数修饰符@的使用方法解析
2019/09/02 Python
python通过文本在一个图中画多条线的实例
2020/02/21 Python
简单的Python人脸识别系统
2020/07/14 Python
python如何获得list或numpy数组中最大元素对应的索引
2020/11/16 Python
html5教你做炫酷的碎片式图片切换 (canvas)
2017/07/28 HTML / CSS
加大码胸罩、内裤和服装:Just My Size
2019/03/21 全球购物
舞蹈教育学专业推荐信
2013/11/27 职场文书
初一生物教学反思
2014/01/18 职场文书
校本教研工作制度
2014/01/22 职场文书
电大本科自我鉴定
2014/02/05 职场文书
日化店促销方案
2014/03/26 职场文书
电影地道战观后感
2015/06/04 职场文书
2015年公司国庆放假通知
2015/07/30 职场文书
python和C/C++混合编程之使用ctypes调用 C/C++的dll
2022/04/29 Python