javascript - What is lexical 'this'?

Question

Could someone please give me a brief introduction to lexical this?

"An arrow function expression (also known as fat arrow function) has a shorter syntax compared to function expressions and lexically binds the this value (does not bind its own this, arguments, super, or new.target). Arrow functions are always anonymous."

Does it mean that when I call a function member using the 'this' ref from a 'Fat Arrow' Function the 'this' always refers to the enclosing 'this'?

Answer 1

You seem to have the correct understanding of what happens with this in an arrow function. I will offer an explanation that I think adds to the conversation and hopefully solidifies your understanding.

As you probably know, when you define a function and use a variable inside of it, it checks if the variable has been defined in its scope. If it is, it uses it! If not, it checks the enclosing scope for that variable definition. It keeps checking enclosing scopes until it finds the variable or reaches global scope. Now, function definitions that are not arrow functions define this for you, implicitly. Thus, they will never check an enclosing scope when you try to use this in their scope (because they find it in their own scope!). Arrow functions do NOT define their own this, so they go to the enclosing scope and look for it just as they would with any variable you try to use in their scope.