将类数组对象(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 = ...
随机推荐
- Easyui treegrid复选框设置
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- 电子科大POJ "a^b"
a ^ b Time Limit: 3000/1000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Others) C-sources: ...
- C#基础:异步调用 【转】
首先来看一个简单的例子: 小明在烧水,等水烧开以后,将开水灌入热水瓶,然后开始整理家务 小文在烧水,在烧水的过程中整理家务,等水烧开以后,放下手中的家务活,将开水灌入热水瓶,然后继续整理家务 这也是日 ...
- Android_通过ContentObserver监听短信数据变化
1.简单介绍 在小米等一些机型,无法接收系统发出的短信广播. 仅仅能通过观察者ContentObserver,去监听短信数据的变化 2.SMS数据介绍 content://sms/inbox ...
- 调用Response.Redirect 捕获异常 解决办法(摘抄)
如果使用 Response.End.Response.Redirect 或 Server.Transfer 方法,将出现 ThreadAbortException 异常.您可以使用 try-catch ...
- C# Web对文件的管理
/// <summary> /// 创建新文件 /// </summary> /// <param name="parentPath">文件路径 ...
- 关于ASP.NET中的负载均衡
ASP.NET站点中做负载均衡: 基于HTTP协议我们可能发现我们要解决两点问题: 第一做到负载均衡,我们需要一个负载均衡器. 可以通过DNS轮询来做,在DNS服务器上配置为每次对我们做负载均衡的同一 ...
- ViewState存储到服务器
把viewstate保存在服务器上 将ViewState持久化保持在服务器端的代码,这样ViewState不占用网络带宽,因此其存取只是服务器的磁盘读取时间.并且它很小,可以说是磁盘随便转一圈就能同时 ...
- RDLC报表系列(二) 行分组
接上一篇文章的内容,今天来说的是行分组.还是打开demo1.rdlc界面,拖入一个文本框和表 1.在表中随便选择一个字段,不然在添加行组的时候不会自动提示.我这里是选择的Dept 2.在下面的行组中右 ...
- MD5校验
好久没有写随笔了,正好这两天可以休整一下,借此机会总结下最近使用python的小体会. 个人体会文件校验在下载文件时使用较多,在linux下最简单的实现方式就是: 1 $ md5sum filenam ...