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 相关文章推荐
从jquery的过滤器.filter()方法想到的
Sep 29 Javascript
js中的hasOwnProperty和isPrototypeOf方法使用实例
Jun 06 Javascript
Bootstrap3学习笔记(三)之表格
May 20 Javascript
微信小程序 封装http请求实例详解
Jan 16 Javascript
微信小程序 视图容器组件的详解及实例代码
Jan 19 Javascript
Vue服务器渲染Nuxt学习笔记
Jan 31 Javascript
解决vue同一slot在组件中渲染多次的问题
Sep 06 Javascript
javascript触发模拟鼠标点击事件
Jun 26 Javascript
基于vue手写tree插件的那点事儿
Aug 20 Javascript
vue 使用鼠标滚动加载数据的例子
Oct 31 Javascript
解决ele ui 表格表头太长问题的实现
Nov 13 Javascript
html5调用摄像头截图功能
Jan 18 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
dede3.1分页文字采集过滤规则详说(图文教程)续二
2007/04/03 PHP
php中异常处理方法小结
2015/01/09 PHP
php解析字符串里所有URL地址的方法
2015/04/03 PHP
php 后端实现JWT认证方法示例
2018/09/04 PHP
jquery select(列表)的操作(取值/赋值)
2009/08/06 Javascript
通过Jscript中@cc_on 语句识别IE浏览器及版本的代码
2011/05/07 Javascript
innerHTML,outerHTML,innerText,outerText的用法及区别解析
2013/12/16 Javascript
JS动态修改图片的URL(src)的方法
2015/04/01 Javascript
快速学习jQuery插件 jquery.validate.js表单验证插件使用方法
2015/12/01 Javascript
nodejs开发微信小程序实现密码加密
2017/07/11 NodeJs
javascript编程开发中取色器及封装$函数用法示例
2017/08/09 Javascript
使用JQuery实现图片轮播效果的实例(推荐)
2017/10/24 jQuery
node.js中axios使用心得总结
2017/11/29 Javascript
浅谈Vue Element中Select下拉框选取值的问题
2018/03/01 Javascript
微信小程序动态添加view组件的实例代码
2019/05/23 Javascript
js/jQuery实现全选效果
2019/06/17 jQuery
Vue-cli3.x + axios 跨域方案踩坑指北
2019/07/04 Javascript
详解vue-router 动态路由下子页面多页共活的解决方案
2019/12/22 Javascript
WebPack工具运行原理及入门教程
2020/12/02 Javascript
python中的五种异常处理机制介绍
2014/09/02 Python
Python Web框架Flask中使用新浪SAE云存储实例
2015/02/08 Python
python实现定时同步本机与北京时间的方法
2015/03/24 Python
python 画函数曲线示例
2019/12/04 Python
解决Python3下map函数的显示问题
2019/12/04 Python
Python虚拟环境的创建和使用详解
2020/09/07 Python
CSS3 RGBA色彩模式使用实例讲解
2016/04/26 HTML / CSS
CSS3.0实现霓虹灯按钮动画特效的示例代码
2021/01/12 HTML / CSS
Can a struct inherit from another struct? (结构体能继承结构体吗)
2016/09/25 面试题
自荐信格式的六要素
2013/09/21 职场文书
超市国庆节促销方案
2014/02/20 职场文书
2015届大学生就业推荐表自我评价
2014/09/27 职场文书
公安机关正风肃纪剖析材料
2014/10/10 职场文书
护士求职自荐信范文
2015/03/04 职场文书
会计岗位职责范本
2015/04/02 职场文书
幼儿园安全教育月活动总结
2015/05/08 职场文书
FP-growth算法发现频繁项集——构建FP树
2021/06/24 Python