How do arrow functions handle 'this'?

Can you explain how arrow functions handle the 'this' keyword in JavaScript?

Sure! Arrow functions do not have their own 'this' context. Instead, they inherit 'this' from the surrounding lexical context.

What does that mean in practical terms?

In practical terms, it means that if you use an arrow function inside a method, it will use the 'this' value from the method's context, not the global context.

Can you give me an example?

Of course! Here's a simple example:

const obj = {
  value: 42,
  getValue: function() {
    return () => this.value;
  }
};

const getValue = obj.getValue();
console.log(getValue()); // Outputs: 42

In this case, the arrow function correctly accesses 'this.value' from 'obj'.

What about regular functions? How do they handle 'this'?

Regular functions have their own 'this' context, which depends on how they are called. If called as a method, 'this' refers to the object the method is called on.