Where does the function context come from in…

The execution context (or this) in JavaScript is determined at the moment the function is called, not when it is declared. Its value is influenced by the following factors:

Global context: Outside of functions, this refers to the global object (in browsers window, in Node.js global). In strict mode ('use strict'), this will be undefined in this case.
```
// In a browser
console.log(this); // window

// In Node.js
console.log(this); // global
```

Calling a method of an object: If a function is called as a method of an object (via dot notation), this refers to that object.

const obj = {
  name: 'Obj',
  method: function() {
    console.log(this.name);
  }
};
obj.method(); // Obj

Regular function call: When a function is called normally (not as a method), this in non-strict mode refers to the global object. In strict mode, this will be undefined.
```
function greet() {
  console.log(this);
}
greet(); // window (in non-strict mode) or undefined (in strict mode)
```
Constructor (with new): When a function is called with the new keyword, it acts as a constructor. this inside the function refers to the newly created instance.
```
function Person(name) {
  this.name = name;
}
const person1 = new Person('Alice');
console.log(person1.name); // Alice
```
Methods call, apply, bind: These methods explicitly set the value of this for a function.
- call and apply invoke the function immediately, passing this as the first argument. call takes additional arguments separately, while apply takes an array.
- bind returns a new function with this permanently bound to the passed first argument.
```
const anotherObj = { name: 'Another Obj' };

function displayContext() {
  console.log(this.name);
}

displayContext.call(anotherObj); // Another Obj
displayContext.apply(anotherObj); // Another Obj

const boundFunction = displayContext.bind(anotherObj);
boundFunction(); // Another Obj
```

Arrow functions: Arrow functions do not have their own this. They "capture" the value of this from the lexical environment in which they were declared. This makes them useful for callbacks inside methods or when working with DOM events.

const objWithArrow = {
  name: 'Arrow Obj',
  method() {
    const arrowFunc = () => {
      console.log(this.name); // `this` is taken from `method` (objWithArrow)
    };
    arrowFunc();
  }
};
objWithArrow.method(); // Arrow Obj

// Compare with a regular function
const objWithRegular = {
  name: 'Regular Obj',
  method() {
    const regularFunc = function() {
      console.log(this); // `this` will be window or undefined (depending on strict mode) when called in this context
    };
    regularFunc();
  }
};
objWithRegular.method(); // window (or undefined)

Understanding the context is one of the key features of JavaScript, and knowing these rules is crucial for working correctly with functions and objects.

Where does the function context come from in JavaScript?