What the actual fuck is "this" Javascript

  • 24
    Anonymous functions (lambdas) bind this to the lexical scope of where they're defined. You defined an anonymous function in a const object in the global closure, in a web browser, so this = window.

    Fully qualified functions use call site invocation, so this is set to wherever that function is invoked from.

    Objects don't create lexically assignable closures, that feature is exclusive to functions/function constructors.

    function test(){
    this.test = "waffles";
    this.test2 = "waffles2"
    this.a = { b: () => this };

    If you create a new instance of test, and invoke a.b, you get the instance of test you created. You will also always receive that value because it is bound to the lexical scope.

    Consider the following:

    const obj = {
    z(){ return this;}

    const objZ = obj.z;

    objZ(); // returns whatever the call site of the invocation is, contextually whatever closure houses objZ
    obj.z() // also returns the call site of the invocation, which in this invocation will be obj
  • 7
    That isn't bug, it's feature.
    You wanna have `this` context down? Use old style function.
    You wanna have upper `this` context, simply don't care about it or want elegant one-liner? Bash arrow function!
  • 4
    Simply never use this, it's a meaningless source of needless confusion.
  • 7
    @Ubbe actually, `this` is useful in class methods, so everybody's in clear that they are operating on instance of class rather than some private variable.
  • 6
    You’re a doofus I’m sorry
  • 2
    "It's not a bug, it's a feature", but for real. It's intentionally like this and both variants have their use.
  • 5
    Don't you know this?
  • 2
    JavaScript.Info is now your evening reading
  • 4
    Why had devRant become flooded with these non-rants?
  • 2
    @ScriptCoded because `this` is complicated, especially if you don't know how variable scopes work.
  • 2
    @C0D4 that's one of cases when it's only so easy to complicate everything rather than to avoid 😂
  • 2
    @vintprox yes, but am I wrong?
  • 1
    @C0D4 it indeed is complicated. You have to know where `this` is convenient and where it is not. Novices are soooo confused coming from other languages (except from Java, bc it has `this` for the use case I pointed out earlier and it's fairly easy).
  • 1
    Freecodecamp explains This

  • 1
    @C0D4 It's not only about `this` though. Also just bashing languages and other technologies all togheter
  • 1
    @vintprox I usually push for fat arrows if they will be a callback somewhere else. Other than that, regular functions.
  • 0
    this was hard enough to get, yet they added arrow function to try make it simple and now it’s fragmented shit
  • 3
    It's in the literal fucking definition of the arrow function on line fucking 1 of the docs. Just saying.
  • 4
    @hashedram The average JS dev will say "you should use arrow functions because they look neater"

    Sometimes I wish JS devs would put in some more effort into what is essentially their daily bread and butter.
  • 0
    not a wtf at all; this is expected behavior and in line with the spec
  • 1
    Yeah this is unintuitive in javascript. You have to read about its behaviour in depth to understand it. And frankly I don't think it's reasonable to expect people to read the friggin spec to use a language. I mean, I understand why it's like this. It's unfortunate but we have to live with it. Y'all javascript fanboys needa chill. No one's favourite language is perfect.

    Thank god they added arrow functions though
  • 0
    @M3m35terJ05h javascript "everyones favorite language."

    You're the chandler of programming.

    *slow clap*.
Add Comment