我是否正确理解这个Function.protype.call()代码



代码:

var content = Array.prototype.map.call(document.getElementsByTagName("p"), function(e) {
  return e.innerHTML;
}); 

它来自JavaScript的第367页:最终指南,第6版。

以下是我认为这段代码中发生的事情

变量content被分配.map()document.getElementsByTagName("p")返回的段落标记的NodeList的调用的结果。

Array.prototype访问.map()方法,并且使用.call()将其this值设置为段落标记NodeList。由于.map()应用有权访问item, index, array的功能,因此function(e)中的eNodeList的项。

因此,content变量最终由.innerHTML对由当前文档中的段落标签组成的NodeList中的每个Element类型Nodes的调用结果组成。

如果给定的HTML元素中没有其他节点,.innerHTML将返回该元素的文本。否则,它将返回其中的HTML节点。

这是正确的吗?我试过:

  1. 阅读Function.prototype.call上的MDN文档
  2. 在搜索程序员SE时,我发现了"误解范围",我不知道该如何解释。它声称MDN文档不完整
  3. 阅读最终书中的更多内容
  4. 在JSFiddle中闲逛——代码按预期运行,我只想知道它是如何做的
是的,正是这样。

只是为了真的挑剔:

如果给定的HTML元素中没有其他节点,.innerHTML将返回该元素的文本。否则,它将返回其中的HTML节点。

.innerHTML始终返回元素的HTML内容,无论它是否包含子元素。当元素不包含子元素时,很难发现元素的文本和HTML之间的区别(但有区别!(。

HTML:

<div>&lt;</div>

JS:

console.log(document.getElementsByTagName("div")[0].innerHTML); // "&lt;"
console.log(document.getElementsByTagName("div")[0].textContent); // "<"

FWIW,这首先是可能的,因为许多JavaScript方法更喜欢鸭子类型而不是依赖于继承

当我看到一只像鸭子一样走路、像鸭子一样游泳、像鸭子那样嘎嘎叫的鸟时,我称之为鸭子

因此,map()将很乐意让您map()任何感觉像数组的对象(即具有.length属性(。

你也可以使用:

var content = [].map.call(document.getElementsByTagName("p"), function(e) { return e.innerHTML; }); 

但前者更可取,因为您不必创建然后一次性使用数组来访问map()函数。

相关内容

最新更新