Events with native vs. lambda functions

Question

Rather a technical question concerning JavaScript events:

Why does

window.onmousewheel = console.log;

throw an Uncaught TypeError: Illegal invocation, while

window.onmousewheel = function (e) {console.log(e); };

works just as expected and prints the event as string? Why is the console.log, when assigned to window.onmousewheel, not just called with one parameter like the lambda expression?

[Chrome doesn't recognize console.log...](http://stackoverflow.com/questions/9612398/chrome-doesnt-recognize-console-log-when-its-called-log) ... http://stackoverflow.com/questions/8904782/uncaught-typeerror-illegal-invocation-in-javascript ... http://stackoverflow.com/questions/16615781/why-is-console-log-illegaly-invocated-as-a-function-parameter ... http://stackoverflow.com/questions/12944987/abbreviating-console-log-in-javascript ... http://stackoverflow.com/questions/5133649/alias-to-chrome-console-log ... http://stackoverflow.com/questions/5456709/create-shortcut-to-console-log-in-chrome — , Jul 29 '13 at 17:38
http://stackoverflow.com/questions/5538972/console-log-apply-not-working-in-ie9 — Igor Dymov, Jul 29 '13 at 17:39
This is more of a question about why `foo.bar()` is different to `fn = foo.bar; fn()`. — Paul S., Jul 29 '13 at 17:41

Esailija · Accepted Answer · 2013-07-29T17:48:59.717

7

When function is called without explicit receiver, the receiver is window (or more generally the global object) or undefined depending on strictness. The function referenced by console.log requires that its this value is an instance of Console.

It is not usually done in user code but you could protect your methods from generic calls as well:

MyClass.prototype.method = function() {
    if( !( this instanceof MyClass ) ) {
        throw new Error("Invalid invocation");
    }
};

edited Jul 29 '13 at 17:48

answered Jul 29 '13 at 17:42

Esailija

138,174
23
272
326

1

thanks for the explanation, not some workaround! – Simon Jul 29 '13 at 17:53

score 3 · Answer 2 · answered Jul 29 '13 at 17:41

3

It all has to do with the scope of console.log

You should do:

window.onmousewheel = console.log.bind(console);

answered Jul 29 '13 at 17:41

Naftali

144,921
39
244
303

Events with native vs. lambda functions

2 Answers2