There's no simple explanation for
this depends on how the function is called. Some general rule of thumb are following:
- If the
new keyword is used when calling the function, this inside the function is a brand new object.
bind are used to call/create a function,
this inside the function is the object that is passed in as the argument.
- If a function is called as a method, such as
this is the object that the function is a property of.
- If a function is invoked as a free function invocation, meaning it was invoked without any of the conditions present above,
this is the global object. In a browser, it is the
window object. If in strict mode ('use strict'), this will be
undefined instead of the
- If multiple of the above rules apply, the rule that is higher wins and will set the this value.
- If the function is an ES2015 arrow function, it ignores all the rules above and receives the
this value of its surrounding scope at the time it is created.