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值而导致的问题。

相关问答FAQs：

1. 在JavaScript中，函数里的this指向什么？
函数中的this是一个指向调用这个函数的对象的指针。具体指向的对象取决于函数的调用方式。

2. JavaScript中的this在不同上下文中指向的对象有什么区别？
在全局作用域中调用函数时，函数里的this指向全局对象window。而在对象方法中调用函数时，函数里的this指向调用该方法的对象。另外，如果使用call()或apply()方法来调用函数，函数里的this可以指向任意一个指定的对象。

3. 如何在匿名函数中正确使用this？
在匿名函数中，this的指向是根据外层函数的调用方式来确定的。为了在匿名函数内部正确使用this，可以使用诸如箭头函数、bind()方法、以及保存外层函数中的this到其他变量中的方式。这样可以确保在匿名函数中调用this时，其指向的是预期的对象。

最后建议，企业在引入信息化系统初期，切记要合理有效地运用好工具，这样一来不仅可以让公司业务高效地运行，还能最大程度保证团队目标的达成。同时还能大幅缩短系统开发和部署的时间成本。特别是有特定需求功能需要定制化的企业，可以采用我们公司自研的企业级低代码平台：织信Informat。 织信平台基于数据模型优先的设计理念，提供大量标准化的组件，内置AI助手、组件设计器、自动化（图形化编程）、脚本、工作流引擎（BPMN2.0）、自定义API、表单设计器、权限、仪表盘等功能，能帮助企业构建高度复杂核心的数字化系统。如ERP、MES、CRM、PLM、SCM、WMS、项目管理、流程管理等多个应用场景，全面助力企业落地国产化/信息化/数字化转型战略目标。 版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们微信：Informat_5 处理，核实后本网站将在24小时内删除。