0

Javascript初学者です。よろしくお願いいたします。

現在地の座標を取得(非同期処理)、取得後変数に格納、表示というプログラムです。

ソース

    async function test() {
        let gpslng;
        let gpslat;
        console.log("1");
        //現在位置を取得する
        let getGPS = await navigator.geolocation.getCurrentPosition(
            //成功時
            position => {
                console.log("2");
                gpslat = position.coords.latitude;
                gpslng = position.coords.longitude;
                console.log("lat:" + gpslat + "\nlng:" + gpslng);
            },
            //失敗時
            e => {
            }
        );
        console.log("3");
        console.log("lat:" +gpslat + "\nlng:" + gpslng);
    }

期待する動作
現在地を東京駅と仮定する
1
2
lat:現在地(東京駅)の緯度(35.681236)
lng:現在地(東京駅)の経度(139.767125)
3
lat:現在地(東京駅)の緯度(35.681236)
lng:現在地(東京駅)の経度(139.767125)

実際の動作
1
3
lat:undefinend
lng:undefinend
2
lat:現在地(東京駅)の緯度(35.681236)
lng:現在地(東京駅)の経度(139.767125)

疑問点
let getGPS = await navigator.geolocation.getCurrentPosition(
この1文のawaitはnavigator.geolocation.getCurrentPositionという関数の呼び出しまでが同期処理で、
成功時または失敗時のコールバック関数については同期処理が保証されていないということでしょうか。

試したこと

成功時のコールバック関数(position)にawaitをつけて、内部の処理を待つようにする

        async function test() {

        let gpslng;
        let gpslat;
        console.log("1");
        //現在位置を取得する
        let getGPS = await navigator.geolocation.getCurrentPosition(
            await function (position) {
                console.log("2");
                gpslat = position.coords.latitude;
                gpslng = position.coords.longitude;
                console.log("lat:" + gpslat + "\nlng:" + gpslng);
            },
            e => {
            }
        );
        console.log("3");
        console.log("lat:" + gpslat + "\nlng:" + gpslng);
    }

これも期待した動作にはなりませんでした。
どう書き直せば期待する動作になりますか。
皆様のお力添えをいただけましたらありがたいです。
何卒よろしくお願いいたします。

1 件の回答 1

1

awaitが待機できるのは、Promiseオブジェクトだけです。navigator.geolocation.getCurrentPosition()は何も返さない関数なので、awaitを指定しても効果がありません。

Promiseを作ってあげればうまく動くでしょう。

console.log("1");
let position = await new Promise((resolve, reject) => {
    navigator.geolocation.getCurrentPosition(resolve, reject);
});
console.log("2");
gpslat = position.coords.latitude;
gpslng = position.coords.longitude;
console.log("lat:" .....);
console.log("3");
console.log("lat:" .....);
1
  • ご回答ありがとうございます。期待した結果を得ることができました。
    – kiki
    Commented 2020年3月12日 0:33

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。