Question

我的功能如下。

我试图用

来调用它

var testVar =  new genericYiiLocation();
console.log(testVar.getLongitude());

然而，我this.getLongitude（）总是有一个空的this.longitude。

我已经检查过this.longitude包含在locateSuccess（loc）中设置时的预期值，看起来没问题。

任何指导都将不胜感激。

function genericYiiLocation() {

    console.log('genericYiiLocation: Creating location handler');

    this.longitude=  '';
    this.latitude=   '';
    this.accuracy=   '';

    if (Modernizr.geolocation) {
        console.log('genericYiiLocation: Location supported');
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(locateSuccess, locateFail);
        }
        else {
            alert('genericYiiLocation: Geolocation is not supported in your current browser.');
            return false;
        }
    } else {
        alert ('genericYiiLocation: no native location support');
        return false;
    }


     function locateSuccess(loc){
        console.log('genericYiiLocation: storing location data');
        this.longitude = loc.coords.longitude;
    }

    // Unsuccessful geolocation
    function locateFail(geoPositionError) {
        switch (geoPositionError.code) {
            case 0: // UNKNOWN_ERROR
                alert('An unknown error occurred, sorry');
                break;
            case 1: // PERMISSION_DENIED
                alert('Permission to use Geolocation was denied');
                break;
            case 2: // POSITION_UNAVAILABLE
                alert('Couldn\'t find you...');
                break;
            case 3: // TIMEOUT
                alert('The Geolocation request took too long and timed out');
                break;
            default:
        }
    }

    this.getLongitude = function(){
        console.log('long: '+this.longitude);
        return this.longitude;
    }
}

Answer 1

据我所知，原因是：

回调中的this locateSuccess与回调外的this不同。要实现您的目标，您可以绑定回调localSuccess＆amp;使用locateFail this到Function.prototype.bind。{/ p>

Answer 2

以下一行：

            navigator.geolocation.getCurrentPosition(locateSuccess, locateFail);

会导致您的locateSuccess功能在您网页的全局范围内执行。因此，当locateSuccess函数尝试访问this时，它会引用window对象而不是genericYiiLocation对象。

解决这个问题的一种快速方法是将genericYiiLocation对象绑定到其范围内的另一个变量，然后在locateSuccess闭包中引用它，如下所示：

function genericYiiLocation() {

    console.log('genericYiiLocation: Creating location handler');

    this.longitude=  '';
    this.latitude=   '';
    this.accuracy=   '';

    //  ADDED
    var me = this;

    if (Modernizr.geolocation) {
        console.log('genericYiiLocation: Location supported');
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(locateSuccess, locateFail);
        }
        else {
            alert('genericYiiLocation: Geolocation is not supported in your current browser.');
            return false;
        }
    } else {
        alert ('genericYiiLocation: no native location support');
        return false;
    }


    function locateSuccess(loc){
        console.log('genericYiiLocation: storing location data');
        //  CHANGED
        me.longitude = loc.coords.longitude;
    }

    // Unsuccessful geolocation
    function locateFail(geoPositionError) {
        switch (geoPositionError.code) {
            case 0: // UNKNOWN_ERROR
                alert('An unknown error occurred, sorry');
                break;
            case 1: // PERMISSION_DENIED
                alert('Permission to use Geolocation was denied');
                break;
            case 2: // POSITION_UNAVAILABLE
                alert('Couldn\'t find you...');
                break;
            case 3: // TIMEOUT
                alert('The Geolocation request took too long and timed out');
                break;
            default:
        }
    }

    this.getLongitude = function(){
        console.log('long: '+this.longitude);
        return this.longitude;
    }
}

调用javascript函数时清空变量

2 个答案: