JavaScript中，函数里this存在哪里

函数中的this通常取决于函数是如何被调用的，而不是在哪里被定义。在JavaScript中，this可以存在于全局环境、对象方法、构造函数和类方法中。其取值可以是全局对象（如浏览器中的window）、当前对象实例或者undefined（在严格模式下）。函数执行时this值的确定主要取决于调用函数的方式：直接调用、作为对象方法调用、作为构造函数调用或者通过apply/call/bind方法调用，每种方式都可能影响this的值。

函数的直接调用通常会让this指向全局对象，如在浏览器中指向window；但在严格模式下，this将是undefined。当函数作为对象的方法调用时，this指的是调用该方法的对象。而在构造函数和类的方法中，this通常会指向一个新创建的实例。通过apply/call/bind方法调用函数时，可以显式地指定this的值。

一、全局上下文中的THIS

在全局执行上下文中，不在任何对象或函数内部的this通常指向全局对象。在浏览器中，这个全局对象是window。如果我们在全局作用域内直接写下this并输出它的值，我们会发现它引用的是全局对象。

console.log(this); // 在浏览器中，这将输出Window对象

但是，如果启用了严格模式（使用'use strict'声明），全局上下文中的this将不再指向全局对象，而是被设置为undefined。

二、函数中的THIS

直接函数调用中的THIS

在非严格模式下，函数内部的this默认指向全局对象。如果是严格模式，函数内的this将会是undefined，因为严格模式不允许this指向全局对象。

function showThis() {
  console.log(this);
}
showThis(); // 在非严格模式下，这将输出Window对象；在严格模式下输出undefined。

对象方法中的THIS

当函数作为对象的方法被调用时，this将指向该方法所属的对象。

let myObject = {
  myMethod: function() {
    console.log(this);
  }
};
myObject.myMethod(); // 这里的this指向myObject

构造函数中的THIS

在构造函数中，this指向新创建的对象实例。

function MyConstructor() {
  this.myProperty = 'value';
  console.log(this);
}
let myInstance = new MyConstructor(); // 这里的this指向新创建的myInstance对象

类方法中的THIS

在ES6类中的方法里，this指向的是类的实例。

class MyClass {
  constructor() {
    this.myProperty = 'value';
  }
  myMethod() {
    console.log(this);
  }
}
let myInstance = new MyClass();
myInstance.myMethod(); // 这里的this指向myInstance实例

三、通过CALL、APPLY和BIND改变THIS

call、apply和bind是Function原型上的方法，它们可以用来显式设置函数执行时this的值。

CALL和APPLY的使用

call和apply功能类似，唯一的区别在于传递参数的方式不同：call方法接受参数列表，而apply方法接受一个参数数组。

function showThis(a, b) {
  console.log(this, a, b);
}
showThis.call(myObject, 1, 2); // 这里的this被显式设置为myObject
showThis.apply(myObject, [1, 2]); // 同上，但参数以数组形式传递

BIND的使用

bind方法创建一个新函数，允许你设置函数体内的this对象，但不立即执行。

let boundShowThis = showThis.bind(myObject, 1, 2);
boundShowThis(); // 这里的this在之后调用时是被绑定在myObject上的

四、箭头函数中的THIS

箭头函数不绑定自己的this，它们捕获其所在上下文的this值作为自己的this值。这意味着在箭头函数中，this与包围它的普通函数的this指向是相同的。

let myObject = {
  myMethod: function() {
    let arrowFunction = () => {
      console.log(this); // 这里的this指向与外围函数的this相同，即myObject
    };
    arrowFunction();
  }
};
myObject.myMethod();

箭头函数的这种行为特别有用，因为它解决了传统函数因为新作用域产生独立的this值而导致的问题。