x={f(){return this}}
x.f() //x
(x.f)() //x
(0,x.f)() //window
I've learned that parenthesis (grouping operator) does not apply GetValue to the expression inside it, while other operators such as , and || do. Does it mean (x.f) and (0,x.f) are actually two different object in the memory, so their this are also bounded to different objects. However, I tried the following ways to compare two functions themselves (not the value they return), they both shown the same. These methods cannot really compare their memory address so I have no idea if they are the same object.
(x.f)==(0,x.f) //true
(x.f)===(0,x.f) //true
Object.is((x.f),(0,x.f)) //true
No, it doesn't mean that at all.
In the below code-snippet,
x.fandy.fare the same function object, yetx.f()andy.f()return different results.How can this be?
Well, it's because
thisisn't actually a characteristic of the function itself; rather, it's passed into the function when the function is called, in much the same way that arguments are passed in. Just asfunction f(arg) { return arg }returns7when called asf(7)but8when called asf(8), sofunction f() { return this }returnsxwhen called asx.f()butywhen called asy.f().This is an essential aspect of how methods work in JavaScript; it's what enables inheritance. For example,
[1, 2, 3].slice(2)and[4, 5, 6].slice(2)both call the sameslicefunction, which is defined on the prototype instance that they both inherit from, but it's able to return the right information for whichever array it's called on.So, returning to your example . . .
x.fand(x.f)and(0, x.f)all evaluate to the same function, but whereasx.f()and(x.f)()both say to call that function and passxas thethisargument,(0, x.f)()does not say to passxas thethisargument (so it defaults to passing the global object,window, as thethisargument).