带有AJAX调用的Javascript变量范围[重复]答案

【问题标题】：Javascript variable scope with AJAX call [duplicate]带有AJAX调用的Javascript变量范围[重复]
【发布时间】：2014-02-26 18:41:41
【问题描述】：

我不是一个经验丰富的 Javascript 程序员，所以这里可能存在一些基本错误。我只想编写一个对 WEBAPI 进行 AJAX 调用并返回数组的函数。但是我在理解变量范围时犯了一些错误。

function GetProductsOfAccount(AccountID) {
      var returnProducts;
      console.log("In GetProductsOfAccount");
      var serviceURL = productURI + "/GetProductsOfAccount/" + AccountID;
      console.log(serviceURL);
      $.ajax({
          type: "GET",
          datatype: "json",
          url: serviceURL,
          context: this,
          success: function (Products) {
              console.log("From AJAX" + Products);
              returnProducts = Products;

              //This correctly holds and shows all products
              console.log("Return Products 1 " + returnProducts);
          },
          error: function (x, y, z) {
              returnProducts = null;
              console.log("Error" + x + '\n' + y + '\n' + z);
          }
      });

     //This just shows undefined
      console.log(" Returned Products 2 " + returnProducts);
      return returnProducts;
  }

为什么returnedProducts最后会失去价值，这样做的正确方法是什么？

【问题讨论】：

is the correct way to do such a thing? - 不，不是
控制台 log2 在 ajax 成功回调之外执行，表示请求尚未完成。
正确。谢谢你。 Arun 提到的问题中的详细回答说明了一切。

标签： javascript jquery asp.net-web-api

【解决方案1】：

编辑：使用 jQuery deferred 的另一种语法（我在 Arun 的链接中没有看到）：

var productsOfAccount = function (AccountID) {

  var serviceURL = productURI + "/GetProductsOfAccount/" + AccountID;

  return $.ajax({
      type: "GET",
      datatype: "json",
      url: serviceURL,
  }).promise();
}

var test = $.productOfAccount(20)

test.then(function(products){
          console.log("From AJAX" + products);
          returnProducts = Products;

          //This correctly holds and shows all products
          console.log("Return Products 1 " + returnProducts);
});

您可以为不同的目的多次应用 test.then。

【讨论】：