首页 > 开发 > JS > 正文

Array.proto.slice.call(doc.querySelectorAll("[bind]"),0)的作用是什么?

2017-09-05 12:50:29  来源:网友分享
Array.prototype.slice.call(document.querySelectorAll("[data-bind]"),0);

的作用是什么?为什么可以这样做?

解决方案

作用是将document.querySelectorAll("[data-bind]")返回的NodeList(Array-like Object)转换为数组。

首先了解什么是Array-like Object:

Array-like objects look like arrays. They have various numbered elements and a length property. But that’s where the similarity stops. Array-like objects do not have any of Array’s functions, and for-in loops don’t even work!

将Array-like Object转化为数组比较直白的方式是:

var nodeList = document.querySelectorAll("[data-bind]");var array = [];for(var i = 0; i < nodeList.length; i ++)    array.push(nodeList[i]);

但是调用Array原型中的slice方法也可以完成转换。参考Array.slice中的“类数组(Array-like)对象”这部分:

slice 方法可以用来将一个类数组(Array-like)对象/集合转换成一个数组。你只需将该方法绑定到这个对象上。下述代码中 list 函数中的 arguments 就是一个类数组对象

所以,可以推测slice内部肯定也是通过length和[i]索引来操作数组或者类数组对象的。