将getCurrentPosition()值推入数组,但无法控制数组的日志元素

时间:2018-11-11 05:59:51

标签: javascript geolocation

我已经将地理位置API封装在getLocation()函数中并返回一个数组。但是,当我尝试访问数组的特定元素时,却变得不确定。我觉得这里缺少一些非常简单的东西。

 const getLocation = function () {
        const arrLocations = [];
        navigator.geolocation.getCurrentPosition(function (position) {
            arrLocations.push(position.coords.latitude)
            arrLocations.push(position.coords.longitude)
        });
        return arrLocations;
    }
    const coord = getLocation();
    console.log(coord);
    console.log(coord[0]);

我还尝试将地理位置包装在一个约定中,以防万一与getCurrentPosition发生异步。调用返回未定义。 (我不确定我是否已经写好了诺言权。我对JavaScript相对陌生):

    new Promise(function (resolve, reject) {
        const arrLocations = [];
        navigator.geolocation.getCurrentPosition(function (position) {
            arrLocations.push(position.coords.latitude)
            arrLocations.push(position.coords.longitude)
        });

        if (!arrLocations) {
            resolve(arrLocations);
        }
        else {
            reject();
        }
    })
        .then(function (arr) {
            return arr;
        })
        .catch(function (e) {
            console.log(`Something went wrong: ${e}`);
        });

为什么数组中的元素返回未定义?为什么诺言返回未定义?谢谢!

1 个答案:

答案 0 :(得分:0)

getCurrentPosition()是异步的,因此第一个代码段不起作用。您正在返回并尝试在异步功能推送任何内容之前记录arrLocations。在第二个想法中使用诺言是一个很好的直觉,只需要进行一些调整即可。

这是一种方式。只需resolve所需的数组,并利用getCurrentPosition的第二个参数进行错误回叫即可根据需要拒绝。 (您可能只会在SO代码段中得到错误):

const getLocation = function() {
  return new Promise((resolve, reject) => {
    navigator.geolocation.getCurrentPosition(
      (position) => resolve([position.coords.latitude, position.coords.longitude]),
      (error) => reject(error)
    );
  })
}

// to use it:

getLocation()
  .then(arrLocations => console.log(arrLocations))
  .catch(err => console.log("there was an error: ", err))