NodeList 借用call方法使用Array.prototype.map方法

来源:互联网 发布:java路径分隔符 编辑:程序博客网 时间:2024/05/22 17:19

感谢小铭专研的精神,让我又进一步

今天一大早,小铭就抛来一个疑问(他是 android 开发,但我觉得他研究 javascript 的精神比我还可敬,佩服,可怜了我这个前端):

return Array.prototype.map.call(links,function(e){    return e.getAttribute('href');})
return links.map(function(e){    return e.getAttribute('href');})

他说,如果这两个方法是等价的,那为什么要写第一种那么长来实现?
我先入为主的观念打死的认为 links 就是一个数组,这两种方法不就是等价的嘛?第一个就是调用了 Array 原型上的 map 方法,一般装逼的人喜欢这么用,但寻思着着不科学啊,第二种方法 links 就是一个数组,那当然就继承了 map 方法,为何还有这两种写法呢?
一再的和他讨论,一再的被否决,一再的查文档,我坚定的认为links就只能是一个数组,要不怎么可能会用Array的方法呢?况且我在测试对象的时候,返回的是一个空数组。
结果,小铭给的截图呆到我了,NodeList,节点的集合,没有考虑过。。。
小铭给的栗子
小铭给的解释
最后乖乖的MDN找答案:NodeList的解释
原来NodeList对象是一个节点的结合,是由 Node.childNodes 和 document.querySelectorAll 返回的集合,类数组的一种类型,只有item这个方法,自然就不会有 Array 对象的 map 方法或者 forEach 等等方法,它要想用 Array 的那些方法,有两种实现方式:
第一种:完全继承 Array 的所有方法

NodeList.prototype = Array.prototype;

第二种:用call()方法来调用 Array 原型链上的 map 方法

Array.prototype.map.call(links,function(e){})

最后,再一次感谢小铭,让我对 NodeList 的了解更深入了一些,我感觉今晚有一场大战要打,如何辩论赢过他的否定呢?先好好写工作先,我很忙的,呜呼

1 0
原创粉丝点击