Simplifying JavaScript

Tip 36

Prevent Context Confusion with Arrow Functions

In this tip, you’ll learn how to use the arrow function to avoid context errors.

Scope and context are probably the two most confusing concepts for JavaScript developers. A function’s scope, at it simplest, is what variables the functions can access. We explored this previously in Tip 3, ​ Isolate Information with Block Scoped Variables ​. Now you’re going to learn about context. Context is what the keyword this refers to in a function or class.

Not only are both concepts hard to grasp, but people often confuse them. I know I confuse them all the time. Ryan Morr gives a simple way to remember the difference: Scope pertains to functions and context pertains to objects.^[36] While ...