Object Scoping


Arrow functions inherently bind , or tie, an already defined this value to the function itself that is NOT the calling object. In the code snippet above, the value of this is the global object , or an object that exists in the global scope, which doesn’t have a dietType property and therefore returns undefined .

I’m a little confused by the wording of the above paragraph. Does this mean “this” is looking inside the function? Why does it talk about the global scope?

What we want this to refer to here is the goat object, so we can access its dietType property. The point of the exercise is to illustrate that using this inside an arrow function does not produce the desired outcome. Inside an arrow function, this refers to the global object not the goat object that we want. If you follow the link in the exercise, you can read about what the global object refers to. If we want to use this in functions included as properties of an object that we created, we cannot use the arrow function syntax.

The instant we bring this into the equation it becomes a design consideration. Do we need context? Do we have immediate context, or is it indirect? What does this refer to in a given scope?

In constructor or class, this can become discombobulated in nested methods. The designer needs to keep a keen eye on this, pun intended.

We can write simple functions that return an object with no inclusion of this; mind, that is a further study. Think ‘factory function’.