时间戳

首页 > 解决方案 > 为什么`this`指的是父函数的作用域

javascript - 为什么`this`指的是父函数的作用域

问题描述

我确实读过该this关键字可以引用全局范围或引用它的对象或事件绑定的对象，但不理解以下行为。

function outer() {
  var inner = 4;

  function innerFunc() {
    var inner = 5;
    console.log('inner called with ' + this.inner);
  }
  return innerFunc;
}
var obj = outer();
obj();

为什么这个日志是 4 而不是 5。AFAIKthis应该引用它所引用的函数，并且应该可以通过closure.

标签： javascript

解决方案

TL;DR -this不像你认为的那样工作。

在此处、此处和此处阅读更多信息。

函数的this（也称为上下文）在调用时确定，而不是在函数定义时确定。this这被广泛称为动态绑定，而闭包中的变量是词法绑定的。

var obj = outer();
obj();

outer使用this = window（或在 Node.js 的情况下）调用，global因为您未处于严格模式（否则，this = undefined）。outer不使用this，所以这不会对其产生很大影响。

outer然后返回一个函数 ( innerFunc)，并将其分配给obj. 然后，您再次调用objwith this = window（因为您没有使用.bind()or.call()或指定任何其他内容.apply()）。

然后你记录this.innerwhich is 等价于window.innerwhich isundefined除非你碰巧有一个inner以某个值命名的全局变量。

那么的值this是由调用者决定的。

如果您obj像这样调用：

obj.call({inner: 42}); // first argument to fn.call() is the context

无论函数是如何定义的，您都会在控制台中看到 42。

减轻这种情况并保持对您的控制的一种方法this是使用fn.bind()或箭头函数。

推荐阅读