javascript - 我的全局变量返回为undefined(JavaScript)

我实际上在这里用基本Javascript挣扎...基本上，我正在尝试创建一个函数，该函数在调用时设置两个变量（经度和纬度），以便以后可以直接使用这些值运行其他函数。

但是，当我尝试提醒经度值时，它会返回未定义状态。

这是我的代码。

var latitude;
var longitude;

function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(displayLocation);
  } else {
    alert("Geolocation is not supported by this browser.");
  }
}

function displayLocation(position, latitude, longitude) {
  latitude = position.coords.latitude;
  longitude = position.coords.longitude;
  return;
}

function newLocation(longitude) {
  alert(longitude);
}

window.onload = function() {
  getLocation();
  newLocation();
}

任何帮助将不胜感激！谢谢。

最佳答案

您发布的代码存在一些问题：

displayLocation的参数隐藏了全局变量。在此处进行分配时，实际上是在分配给局部范围内的参数变量。

function displayLocation(position, latitude, longitude) {
  latitude = position.coords.latitude;
  longitude = position.coords.longitude;
}

IIRC，geolocation.getCurrentPosition的回调仅采用第一个参数，因此您不必将latitude和longitude定义为参数。

newLocation函数中的相同问题。您可以在不带参数的情况下调用它，但是longitude参数是“隐藏”全局变量。

这些是小的语法问题。但是，代码中还有另一个问题，要解决比较棘手。

加载页面后，可以依次调用两个函数：

window.onload = function() {
    getLocation();
    newLocation();
}

第二个函数newLocation期望getLocation设置了全局变量。但是，事实并非如此。当getLocation函数调用geolocation.getCurrentPosition时，它正在执行异步操作。调用后的下一行将继续立即执行，但是尚未调用回调函数displayLocation。起初，这可能有点复杂，但是基本上您只需要在newLocation运行后才调用displayLocation。

如此复杂吗？这就是为什么完全避免全局变量被认为是一种好习惯。 Javascript经常迫使我们进行异步编程，并且试图了解全局变量在任何给定时间可能处于的所有可能状态可能会使您发疯。

相反，如果可能，您应该始终直接使用函数参数。例如，在您的方案中，您可以完全跳过displayLocation步骤，直接进入newLocation：

function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(newLocation);
  } else {
    alert("Geolocation is not supported by this browser.");
  }
}

function newLocation(position) {
    alert(position.longitude);
}

因此，不再需要全局变量。

我敢肯定，您发布的示例代码已经简化，您的实际代码也更加复杂，但是如果您能够遵循这些原则，那么我认为使用JavaScript会更好。