在计算对象上调用方法时，javascript中的“this”是什么？

Question

我知道this可能是javascript中第二个被问到最多的东西，就在浮点运算之后。

我大致知道怎么this工作的，以及它如何通过箭头功能的影响， .call() .apply()和.bind() 我以为我理解了它的一切。 但我不。

在Web浏览器中， document.createElement("div").classList.add("c")按预期产生undefined 。 然而，这个表达令人惊讶地是一个错误。

(true && document.createElement("div").classList.add)("c")

我预计它会是一样的，但它确实如此

Uncaught TypeError: Illegal invocation
    at <anonymous>:1:54

Answer 1

你的陈述

(true && document.createElement("div").classList.add)("c")也可以重写如下：

var add = (true && document.createElement("div").classList.add)
add("c")

[逻辑AND（&&）expr1 && expr2：如果可以转换为false，则返回 expr1; 否则， 返回 expr2。]

您看到函数add现在是window一部分并且丢失了对实际classList对象的引用，因此无法正确调用。

添加的this现在指向全局对象。

如果您执行以下操作（如果新div是您页面上唯一的div），则它再次引用原始对象：

(true && document.createElement("div").classList.add).bind(document.getElementsByTagName("div")[0].classList)("c")

Answer 2

这将有效，因为它this作为classlist上下文返回

(document.createElement("div").classList.add)("c")

(true && document.createElement("div").classList.add)将不起作用，因为使用&&表达式对add进行求值，然后返回表达式的返回上下文(true && document.createElement("div").classList.add)这是add() { [native code] }而不是classList，在这里我们尝试调用add on add function。

当你尝试传递类名("c")来add这不再是类classlist因此Illegal invocation

Answer 3

你尝试做什么都没有意义。 也许你的意思是

var added document.createElement("div").classList.add("c")
If (added){...….}

在你的例子中，添加后你有a）太多了