Question

现在对我来说这是一个新的。我四处搜索，但在其他地方找不到解决方案。

我有这个代码（coffeescript）：

PositionDetector = ->

    detectPosition : ->
        console.log this # outputs 'Object' (OK)
        navigator.geolocation.getCurrentPosition(this.locationHandler)

    locationHandler : (position) ->
        console.log this # outputs 'Window' (WHY??)

positionDetector = new PositionDetector()
positionDetector.detectPosition()

（或相应的已编译的javascript，如果您愿意）：

var PositionDetector = function() {

      detectPosition : function() {
        console.log(this); // outputs 'Object'
        navigator.geolocation.getCurrentPosition(this.locationHandler);
      },

      locationHandler : function(position) {
        console.log(this);  // outputs 'Window'
      }
}

var positionDetector = new PositionDetector();
positionDetector.detectPosition();

问题是，为什么第一个'this'输出'Object'而第二''输出'Window'？

Live demo in a Codepen

Answer 1

因为this取决于来电者。 this.locationHandler的来电者是navigator.geolocation.getCurrentPosition(callback)，它会调用callback()这样的函数，请注意，该调用中没有点，这意味着this没有值。解决方案是使用this永久设置bind：

navigator.geolocation.getCurrentPosition(this.locationHandler.bind(this))

请记住，一般规则：没有点，没有this，除非您使用call或apply来调用该函数，或bind来设置this的值1}}永远。

Answer 2

T.J.克劳德＆amp; elclanrs是对的。

作为简要说明： “this”指的是对象上下文（A.K.A.范围），它不能完全按照您在javascript中的预期工作，

您在PositionDetector的上下文中调用detectPosition（）。
在窗口的上下文中调用locationHandler（），该窗口是全局对象和事件发起者。

恕我直言这种情况使Javascript变得愚蠢。有两种方法可以克服这种影响。首先是他们已经展示的“绑定”方法。第二个是神奇的“封闭”一代。

'this'在同一个对象中返回'Object'或'Window'

2 个答案: