Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

It's literally how it works for arrow-less functions, though - "this" is bound to the receiver at call site:

   foo = function() { console.log(this.n); };
   o1 = { foo, n: 1 };
   o2 = { foo, n: 2 };
   o1.foo();  // 1
   o2.foo();  // 2
I can't think of any other language that does it this way. Arrow-functions, OTOH, behave as lambdas normally do:

   foo = () => { console.log(this.n); };
   o1 = { foo, n: 1 };
   o2 = { foo, n: 2 };
   o1.foo(); // undefined
   o2.foo(); // undefined


Neither of these code snippets demonstrate binding 'this' at the call site. In any event, I strongly suggest avoiding 'this' as much as humanly possible in javascript because a) it's wonky and b) you never need it.


In the first example, when you look at the first line

  foo = function() { console.log(this.n); };
You cannot possibly know what "this" refers to when the function is eventually called. Is it some object? Is it the surrounding class or function? Is it window? Is it undefined? Is it the function itself?

There's no way to know, because it hasn't been decided yet. Deciding what `this` refers to in the "normal"/non-arrow functions is up to the caller.

  o1.foo();
Here, `this` will be o1.

  o2.foo();
here, `this` will be o2.

  o1.foo.call("hello")
here, `this` will be `new String("hello")`.

That's what the parent commenter meant by "binding this at the call site".

Classes are still very common out there, despite the popularity of e.g. React function components etc, and `this` is pretty essential with classes.


Where do you think the binding happens in my example, then?


In line 3, where it's called

     })();
With this way of invoking, `this` will be `undefined` in "strict mode" (i.e. if the file or parent function has 'use strict' or if we are in an ES module), and Window in "sloppy mode".




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: