首页 > 代码库 > 将类数组对象(array-like object)转化为数组对象(Array object)
将类数组对象(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)
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。