使用 jquery/json/getJSON 创建辅助方法答案

【问题标题】：Creating a helper method with jquery/json/getJSON使用 jquery/json/getJSON 创建辅助方法
【发布时间】：2011-04-14 07:13:56
【问题描述】：

我想创建一个可以包含在包含的 javascript 中并易于引用的辅助方法。 helper 方法包装了来自 jquery 的 .getJSON 函数...

function doSomething(someThing) { 
  $.getJSON(theCoolestURLEver, {auth_key:"barfoo", id:someThing}, function(data) {
   console.log(data);
   return data;
  });
}

在我的普通 HTML 页面中，我想做的是：

<html>
<head>
   <script src="/_/js/myCoolFunctions.js"></script>
</head>
<body>
<script>
  var someThing = "foobar";
  var data = doSomething(someThing);
  console.log(data);
</script>
</body>
</html>

最终结果是 console.log 在第二个代码块中返回为未定义。我现在明白这与范围有关，或者页面加载时标签加载时数据不可用。所以......如果这是真的，我如何创建一个可以隐藏一些一直发生的复杂性的辅助方法？就像添加 auth_key ...

【问题讨论】：

jQuery: Return data after ajax call success 和 so many more 的可能重复项

标签： javascript jquery json getjson

【解决方案1】：

问题在于 AJAX 请求（例如$.getJSON）是异步的。这意味着函数调用在请求完成之前立即返回。你提供了一个回调——这个函数在接收到数据后运行；这将是在console.log之后。

（补充一点，return 只设置处理程序的返回值，而不是 doSomething 函数。）

我认为最好的方法是创建自己的辅助方法：

$.getJSONAuth = function(url, data, success) {
    var authData =  {auth_key:"barfoo"};

    if ($.type(data) === 'function') {
        success = data;
        data = authData;
    } else {
        data = $.extend({}, authData, data);
    }

    return $.ajax({
        url: url,
        type: 'GET',
        dataType: 'json',
        success: success,
        data: data
    });
}

您现在可以这样称呼它：

$.getJSONAuth(theCoolestURLEver, {id:someThing}, function(data) {
    console.log(data);
});

【讨论】：

【解决方案2】：

你的 doSomething 函数不会返回任何东西，getJSON 的回调函数会。 getJSON 是异步执行的，因此您的 doSomething 函数在请求完成之前结束。但是，您可以将函数传递给 doSomething 函数：

function doSomething(someThing, callback) { 
  $.getJSON(theCoolestURLEver, {auth_key:"barfoo", id:someThing}, function(data) {
   callback(data)
   return data;
  });
}

然后这样称呼它：

<script>
  var someThing = "foobar";
  doSomething(someThing, function(data) { console.log(data); });
</script>

【讨论】：

【解决方案3】：

如果你这样做：

$.getJSON(theCoolestURLEver, {'auth_key:"barfoo"', 'id:someThing'}, function(data)

注意 ' 符号围绕 json 键。我不知道，但我会这样做。

【讨论】：

那是无效的 JavaScript... 你有一个误解：(a) 这不是 JSON，它是一个 JS 对象，对他们来说，键不必用引号引起来（仅如果它们不是有效的标识符或数字或......其他东西）。 (b) 如果有，JSON 中的键必须用双引号括起来。