javascript - JavaScript OOP“此”范围不起作用

地图类：

function Map() {
    this.map;
    this.userLatitude = 0;
    this.userLongitude = 0;

    this.startPositionReporting();
}

Map.prototype.getUserPosition = function () {
    alert(this.userLatitude);

    return {
        latitude: this.userLatitude,
        longitude: this.userLongitude
    };
};

Map.prototype.startPositionReporting = function () {
    var geolocationOptions = {
        enableHighAccuracy : true
    };

    function showError(error) {
        switch(error.code) {
            case error.PERMISSION_DENIED:
                alert("User denied the request for Geolocation.");
                break;
            case error.POSITION_UNAVAILABLE:
                alert("Location information is unavailable.");
                break;
            case error.TIMEOUT:
                alert("The request to get user location timed out.");
                break;
            case error.UNKNOWN_ERROR:
                alert("An unknown error occurred.");
                break;
        }
    }

    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
            this.userLatitude = position.coords.latitude;
            this.userLongitude = position.coords.longitude;
        }, null, geolocationOptions);
    }
};

调用对象：

var mapObject = new Map();
console.log(mapObject.getUserPosition()); // Why does this return 0???

我不知道为什么mapObject.getUserPosition()返回0。我在this.userLatitude方法中检查了this.userLongitude和startPositionReporting，它们工作正常。这一定与范围有关……有什么想法吗？

最佳答案

一些。问题在于this的行为方式与您的想法不同。

this绑定到函数的作用域，并动态解析（在调用函数时）。

您的问题是您有一个回调传递给navigator.geolocation.getCurrentPosition，在该函数中，您正在this上设置属性，希望this作为您的实例。

不是。

在您的情况下，this最有可能是window。

两种解决方案是：

Map.prototype.startPositionReporting = function () {
    var map = this; // instance of Map

    /* ...  */
    navigator.geolocation.getCurrentPosition(function (position) {
        map.userLatitude = position.coords.latitude;
        // ...
    });

要么

var updateMapCoords = function (position) {
        this.userLatitude = position.coords.latitude;
        // ...
};


Map.prototype.startPositionReporting = function () {
    var map = this; // instance of Map
    var updateMap = updateMapCoords.bind(map);
    // returns a copy of the function with `this` set to the value passed to `bind`
    // ...

    navigator.geolocation.getCurrentPosition(updateMap);
    // ...

关于javascript - JavaScript OOP“此”范围不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/23162356/