0
let cat = {
  meow: function () {console.log('meow')},
  fatThisMeow: () => {
    return this.meow()
  },
  thisMeow: function () {
    return this.meow()
  }
}

cat.thisMeow() // "meow"
cat.fatThisMeow() // error

I had read that fat arrows don't set new scopes so I would think cat.fatThisMeow would work too but now I'm confused.

stackjlei
  • 9,485
  • 18
  • 65
  • 113
  • The value of `this` inside an arrow function is the value it has in the surrounding scope, so in your code it would be `window`. – 4castle Aug 06 '18 at 00:25
  • @4castle isn't the surrounding scope the object cat? – stackjlei Aug 06 '18 at 00:28
  • No, object literals don't create a scope. – 4castle Aug 06 '18 at 00:30
  • @4castle so how does `thisMeow` refer to `this`? Isn't the `this` inside referring to the scope that's created by the object literal? – stackjlei Aug 06 '18 at 00:33
  • 1
    I recommend reading all of the [documentation for `this`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this) because it's a common source of confusion. `this` is bound at the call-site by using the object before the `.` in the method call. So `cat.thisMeow()` sets `this` to `cat` since it's what comes before the `.`. – 4castle Aug 06 '18 at 00:38
  • thanks @4castle i think i understand it now that regular functions uses `this` as the object that calls it whereas fat arrows refers to the context in which it was declared – stackjlei Aug 06 '18 at 00:40

0 Answers0