I know this
is probably the second most asked-about thing in javascript, right after floating point arithmetic.
我知道这可能是javascript中第二大问题,仅次于浮点运算。
I generally know how this
works, and how it's affected by arrow functions, .call()
, .apply()
, and .bind()
. I thought I understood everything about it. But I do not.
我通常知道它是如何工作的,以及它如何受到箭头函数、.call()、.apply()和.bind()的影响。我以为我什么都懂。但我不。
In a web browser, document.createElement("div").classList.add("c")
yields undefined
as expected. However, this expression surprisingly is an error.
在web浏览器中,document.createElement("div").class list .add("c")会产生未定义的结果。然而,这个表达式令人惊讶的是一个错误。
(true && document.createElement("div").classList.add)("c")
I expected it to be the same, but it's
我期望它是一样的,但它是
Uncaught TypeError: Illegal invocation
at <anonymous>:1:54
3 个解决方案
#1
5
Your statement
你的语句
(true && document.createElement("div").classList.add)("c")
can also be rewritten as following:
(true & document.createElement(“div”).classList.add)(“c”)也可以重写为:
var add = (true && document.createElement("div").classList.add)
add("c")
[Logical AND (&&) expr1 && expr2 : Returns expr1 if it can be converted to false; otherwise, returns expr2.]
[逻辑和(&&)expr1 && expr2:如果可以转换为false,则返回expr1;否则,返回expr2。)
You see that function add
is now part of window
and loses reference of actual classList
object and hence cannot be called correctly.
您可以看到函数add现在是窗口的一部分,丢失了实际类列表对象的引用,因此不能正确调用。
add's this
now points to global object.
这个现在指向全局对象。
If you do following (if the new div is the only div on your page), it again has reference to the original object:
如果您执行以下操作(如果新div是您页面上惟一的div),那么它将再次引用原始对象:
(true && document.createElement("div").classList.add).bind(document.getElementsByTagName("div")[0].classList)("c")
#2
3
This will work, as it is returning this
as classlist
context
这将会工作,因为它返回的是classlist上下文
(document.createElement("div").classList.add)("c")
(true && document.createElement("div").classList.add)
will not work as add
is getting evaluated with && expression and after this its returning context of the expression (true && document.createElement("div").classList.add)
which is add() { [native code] }
and not classList and here we are trying to call add on add function.
(true & document.createElement("div").classList.add)不会起作用,因为add正在用&&表达式求值,在此之后,它返回表达式的上下文(true & document.createElement("div").classList.add .add .),它是add() {[] {[[[[[native - code]]]}]}]},而不是classList。
When you are trying pass class name ("c")
to add
then this is not classlist
any more hence Illegal invocation
当您尝试传递类名(“c”)来添加时,这就不再是classlist了,这就是非法调用
#3
-7
What you are tryng to do doesnt make sense. Maybe you mean
你正在做的事情没有意义。也许你的意思
var added document.createElement("div").classList.add("c")
If (added){...….}
In your example you have a ) too much after add
在你的例子中,你有一个)在添加之后太多
#1
5
Your statement
你的语句
(true && document.createElement("div").classList.add)("c")
can also be rewritten as following:
(true & document.createElement(“div”).classList.add)(“c”)也可以重写为:
var add = (true && document.createElement("div").classList.add)
add("c")
[Logical AND (&&) expr1 && expr2 : Returns expr1 if it can be converted to false; otherwise, returns expr2.]
[逻辑和(&&)expr1 && expr2:如果可以转换为false,则返回expr1;否则,返回expr2。)
You see that function add
is now part of window
and loses reference of actual classList
object and hence cannot be called correctly.
您可以看到函数add现在是窗口的一部分,丢失了实际类列表对象的引用,因此不能正确调用。
add's this
now points to global object.
这个现在指向全局对象。
If you do following (if the new div is the only div on your page), it again has reference to the original object:
如果您执行以下操作(如果新div是您页面上惟一的div),那么它将再次引用原始对象:
(true && document.createElement("div").classList.add).bind(document.getElementsByTagName("div")[0].classList)("c")
#2
3
This will work, as it is returning this
as classlist
context
这将会工作,因为它返回的是classlist上下文
(document.createElement("div").classList.add)("c")
(true && document.createElement("div").classList.add)
will not work as add
is getting evaluated with && expression and after this its returning context of the expression (true && document.createElement("div").classList.add)
which is add() { [native code] }
and not classList and here we are trying to call add on add function.
(true & document.createElement("div").classList.add)不会起作用,因为add正在用&&表达式求值,在此之后,它返回表达式的上下文(true & document.createElement("div").classList.add .add .),它是add() {[] {[[[[[native - code]]]}]}]},而不是classList。
When you are trying pass class name ("c")
to add
then this is not classlist
any more hence Illegal invocation
当您尝试传递类名(“c”)来添加时,这就不再是classlist了,这就是非法调用
#3
-7
What you are tryng to do doesnt make sense. Maybe you mean
你正在做的事情没有意义。也许你的意思
var added document.createElement("div").classList.add("c")
If (added){...….}
In your example you have a ) too much after add
在你的例子中,你有一个)在添加之后太多