将类数组对象(array-like object)转化为数组对象(Array object)
用法：Array.prototype.slice.call(array-like object)
// 创建一个类数组对象
var alo = {0:"a", 1:"b",2:"c", length:3}; // 转化
var arr = Array.prototype.slice.call(alo); console.log(
Array.isArray(alo) // false
) console.log(
Array.isArray(arr) // true
) console.log(alo); // { '0': 'a', '1': 'b', '2': 'c', length: 3 }
console.log(arr); // [ 'a', 'b', 'c' ]
下面分析它是如何工作的.
类数组对象拥有类似数组的结构，所以它可以使用大多数数组的方法。
数组里有一个方法slice()，遍历调用对象，然后返回一个数组。
这里有一个问题，slice()是数组对象的方法，那该如何使用？
数组方法是数组对象的属性，所以可以通过Array.prototype.slice获取它。
然而在一个对象里调用其它对象的方法，我们需要用到"Function.prototype"里的方法call()，像这样function name.call(obj,args)。
所以有，Array.prototype.slice.call(alo)
slice()是一个函数(function),所以从Function.prototype继承了方法call,这也就是为什么我们可以这样用Array.prototype.slice.call(...)
Function.prototype.call(obj)的第一个参数是一个对象，即将传给f.call(obj)函数里的f，这一步，f的上下文(关键词this)的值会是obj.
一般情况下Array.slice()，方法slice将Array作为this的值，使用索引遍历所有的数组元素。在我们的例子中，我们将alo设置为this的值，alo是类数组，本身又具有索引，因此而工作。
NodeList，HTMLCollection都是类数组对象
<body>
<ul id="ho" class="ho">
<li></li>
</ul>
<script>
// 创建一个htmlCollection对象
var htmlCollection = document.getElementsByTagName("li"); // 创建一个NodeList对象
var nodeList = document.getElementById("ho").childNodes; // 转化
var h2arr = Array.prototype.slice.call(htmlCollection);
var n2arr = Array.prototype.slice.call(nodeList); console.log(htmlCollection); // HTMLCollection [ <li> ]
console.log(nodeList); // NodeList [ #text "", <li>, #text "" ] console.log(h2arr); // Array [ <li> ]
console.log(n2arr); // Array[ #text "", <li>, #text "" ]
</script>
</body>
将类数组对象(array-like object)转化为数组对象(Array object)的更多相关文章
- PHP查询数据库，对象结果集转化为数组
$row = $this->db->get();//得出对象结果集 $result = array(); if($row) { //转化为数组 while($value = $row-&g ...
- Javascript中判断变量是 array还是object（是数组还是对象）
段文字是从github上截取由本人翻译过来的. 原文地址:https://github.com/nathansmith/javascript-quiz/blob/master/ANSWERS.md 怎 ...
- Array.from()类数组转化为数组的用法
类数组对象转化为数组 let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length: 3 }; let arr = Array.from(arrayLi ...
- Js将类数组转化为数组
说起伪数组,大家可能会想到arguments, 这个我们函数参数的一个类数组,是类数组的代表. 1.拥有length属性,可以使用下标来访问元素,这两点和数组相同. 2.不能使用数组的方法,他们不能使 ...
- js中怎么把类数组转化为数组
说起伪数组,首先想到arguments, 这个我们函数参数的一个类数组,是类数组的代表. 1.拥有length属性,可以使用下标来访问元素,这两点和数组相同. 2.不能使用数组的方法,他们不能使用Ar ...
- php如何遍历多维的stdClass Object 对象，php的转换成数组的函数只能转换外面一丛数组
php如何遍历多维的stdClass Object 对象,php的转换成数组的函数只能转换外面一丛数组 (2012-09-10 19:58:49) 标签: 杂谈 分类: 网页基础知识 php如何遍历多 ...
- PHP“Cannot use object of type stdClass as array” (php在调用json_decode从字符串对象生成json对象时的报错)
php再调用json_decode从字符串对象生成json对象时,如果使用[]操作符取数据,会得到下面的错误 错误:Cannot use object of type stdClass as arra ...
- php---将数组转化为数组对象
例子:array(1){ [0]=>array( 'id'=>111, 'name'=>'aaaa' ) } 由上面的例子转化成下面对象,怎么转化?急急 急 谢谢array(1) { ...
- Yii框架AR对象数据转化为数组
demo函数作用:将AR对象数据转化为数组 局限:仅用于findAll的多维数组,find一维数组可以先转化为多维数组的一个元素在使用 function actionIndex() { $data = ...
随机推荐
- (转载博文)MFC 窗口句柄获取
句柄获取方法(获取该窗口的句柄后,即可向该窗口类类发送消息.处理程序):0.获取所在类窗口的句柄: this->m_hwnd 1.主窗口的句柄: 无论在主窗口类内,还是子窗口类内,获取主窗口句柄 ...
- 数组中出现次数超过一半的数字 -java
数组中出现次数超过一半的数字 -java 方法一: 数组排序,然后中间值肯定是要查找的值. 排序最小的时间复杂度(快速排序)O(NlogN),加上遍历. 方法二: 使用散列表的方式,也就是统计每个数组 ...
- Sumsets(3sum问题，枚举d,c二分a+b)
Sumsets Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 9997 Accepted: 2736 Descripti ...
- ffmpeg+SDl+ 播放器 -01
最近因公司项目需要,打算自己在LINUX平台整一个播放器,来学习和研究音频编解码. 项目需求: 支持下列格式文件播放. 1> WMA 硬件解码,但需要软件分析ASF格式,提取Payload数据 ...
- XP用户：消除误解，大胆拥抱Linux
4月23日.知名家评论家Silviu Stahie发表文章.题为"Windows Users and Their Misconceptions About Linux". ...
- Array数组方法的总结
添加元素: 1. push(arg1,arg2,arg3....) 向数组的尾部添加元素,返回值是数组的长度. 2.unshift(arg1,arg2,arg3....) 向数组的头部添加元素,返回 ...
- 用于Lucene的各中文分词比较
对几种中文分析器,从分词准确性和效率两方面进行比较.分析器依次为:StandardAnalyzer.ChineseAnalyzer.CJKAnalyzer.IK_CAnalyzer.MIK_CAnal ...
- c++到c#数据类型的转换
c++与c#的类型转换 分类:cSharp | 标签: c# system intptr char uint 2012-02-29 19:54 阅读(513)评论(0)编辑删除 //c++: ...
- HTML3层叠样式表
层叠样式表:CSS Cascading Style Sheet.V2.1 控制页面样式外观. 一.样式表分三类: 1.内联样式表.--放在元素的开始标记中.--只对当前元素起作用. <in ...
- Linux编程C/C++
C/C++基本数据类型 C/C++语言有一组基本数据类型,对应于计算机的基本存储单元和使用这些单元去保存数据的一些常用方式. 基本数据类型如下: 上面表格中的类型是基本的C/C++数据类型,但是在C+ ...