在预定义函数内访问的全局变量返回 null - javascript

Question

由于某种原因，我无法访问变量。可能是范围问题，或者时间问题，查不出来。这是我的简化代码：

var endResult = "";

//function loads html into given element.Called as a callback later when google maps direction service is done//
function getResults(){
  $.ajax({
    url:'foo.php',
    data: endResult,
    //etc., response loaded asynchronously in div element//
  });
}

//when form is submitted
$('#form').submit(function(){
  var endResult = "";
  //get form data, define variable//
  $.post('bar.php',function(data){
    var location = data;
    //initialize Maps Directions Service//
    var directionService = new google.maps.DirectionsService();
    //function gets directions, and loads a single value into global variable "endResult"//
    function calcRoute(){
      var request = {//google maps arguments containing form data//};
      directionsService.route(request, function(result, status) {
        var endResult = JSON.stringify(result.routes[0].legs[0].distance.value);  
        console.log(endResult); //Outputs intended value from google maps//
        //run function as a callback making sure that "endResult" is not null//
        getResults(); //iside this function - value of "endResult" is null, data sent to foo.php is null//
      });
    }
    calcRoute();
  }
  return false;
});

就是这样，一旦我在该函数中调用 getResults()，endResult 将为空。我确信这很简单，但我无法理解它。

Answer 1

你没有分配给全局变量，因为你有

    var endResult = "";
//  ^^^

在提交处理程序中，并且

    var endResult = JSON.stringify(result.routes[0].legs[0].distance.value);
//  ^^^

...在calcRoute.

那些在那些函数中声明局部变量，这些变量会影响全局（calcRoute 中的那个会影响提交处理程序中的那个）。

只需删除那些vars，因此您将分配给代码关闭的变量（全局）。

---

一般来说，避免使用真正的全局变量，并尽量减少函数具有副作用的程度（例如分配和读取它们关闭的变量）。在这种情况下，endResult 不是全局变量，calcRoute 没有理由不能将其作为参数传递给 getResults。

Answer 2

您应该在该函数中将该变量作为参数传递。

getResults(endResult);

您应该避免在表单提交函数中使用var。如果这样做，它将再次被声明为局部变量，并将被限制在该函数的范围内。