Question

这应该引用对象本身但在下面的代码中为什么它的行为不同？

var x   = 4,
    obj = {
        x: 3,
        bar: function() {
            var x = 2;
            setTimeout(function() {
                var x = 1;
                alert(this.x);
            }, 1000);
        }
    };
obj.bar();

为什么警报为4而不是3？

Answer 1

内部 setTimeout 回调this指的是窗口对象，因此它检索在全局上下文中定义的变量。

您可以使用 Function#bind 方法绑定此上下文，使其正常工作。

var x = 4,
  obj = {
    x: 3,
    bar: function() {
      var x = 2;
      setTimeout(function() {
        var x = 1;
        alert(this.x);
      }.bind(this), 1000);
    }
  };
obj.bar();

或者使用局部变量来缓存对this的引用并使用内部回调函数。

var x = 4,
  obj = {
    x: 3,
    bar: function() {
      var x = 2,
        that = this;
      setTimeout(function() {
        var x = 1;
        alert(that.x);
      }, 1000);
    }
  };
obj.bar();

另请参阅MDN文档：The "this" problem

为什么这是指外部变量？

1 个答案: