地理位置與打字稿

我有下面的代碼片段：地理位置與打字稿

pos:number; 

getPosition() { 
    navigator.geolocation.getCurrentPosition((position) => { 

     this.pos = position.coords.latitude;

當我調試我得到了一個未定義的this.pos，並在position.coords.latitude

一些數字，不過，我有以下幾點代碼片段：

pos:any; 

getPosition() { 
    navigator.geolocation.getCurrentPosition((position) => { 

     this.pos = position.coords.latitude;

然後設置this.pos。爲什麼這樣的行爲？

來源

2016-05-17 adam nowak

您確定這種情況發生了嗎？類型註釋在最終的javascript中不存在，因此它們不會對代碼的行爲產生任何影響。也許這是一個調試器的錯誤...如果你做console.log（this.pos）;設置this.pos後它是否輸出undefined在第一種情況下仍然 –

如果您確定位置已定義並且您正在進入那裏，那是因爲this已更改。 this上下文可以根據它的調用方式而改變。如果您通過一個事件調用它，那麼this將被限定在窗口或發起事件的元素。例如

export class GeoService { 
    public pos: any; 

    public getPosition() { 
    navigator.geoLocation.getCurrentPosition((position) => { 
     this.pos = position; 
    }); 
    } 
} 

let geo = new GeoService(); 

// When called, `this` will be the window 
setTimeout(geo.getPosition, 1000); 

// When called, `this` will be the dom element 
document.getElementById('myDiv').addEventListener('click', geo.getPosition);

您可以通過調用原始對象方法 -

// When called, `this` will be the window 
setTimeout(() => { geo.getPosition(); }, 1000); 

// When called, `this` will be the dom element 
document.getElementById('myDiv').addEventListener('click',() => { geo.getPosition(); });

或者，通過使用lambda來確保它的設置爲getPosition作爲GeoService類的屬性匿名函數解決這個問題適當範圍。

export class GeoService { 
    public pos: any; 

    public getPosition =() => { 
    navigator.geoLocation.getCurrentPosition((position) => { 
     this.pos = position; 
    }); 
    } 
}

後者的注意事項。它可以使事情變得簡單並減少冗餘代碼，但請記住，每次構建GeoService類時都會創建一個新函數。這意味着每個實例都有一個這個函數的副本，而不是共享一個公共內存空間。換句話說，內存的成本更高。

希望這可以解決您的問題。

來源

2016-05-17 18:30:13

完美！它爲我解決了這個問題。 –

這個答案是前一陣子。今天我推薦'geo.getPosition.bind（geo）' –

地理位置與打字稿

回答

相關問題