返回 Json.Stringify 结果

Question

我有这段代码：

$.getJSON('http://myjsonurl', function(json){console.log(JSON.stringify(json.columns)); });

这会在控制台中返回我从 json 响应中需要的所有内容。我的目标是将这个值放入一个函数中，以便我可以在另一个地方调用它。 （例如：

"columns" : getColumns();

所以我正在制作这样的功能：

function getColumns() {
    $.getJSON('http://myjsonurl', function(json){return JSON.stringify(json.columns); });
    }

console.log(getColumns()); // and then call the function in the console log expecting to see the same result as before.

但我得到的只是未定义的。 为什么？

更新：

这就是我实现我想要的方式的方式。以下代码将根据带有数据和列的 json 响应重新启动数据表（数据表本身不支持的内容）。该代码将使用新的查询参数重新加载表格并包含按钮插件：

var theurl;
theurl = "http://myjson.json";


function updateQueryStringParameternondt(key, value) {
    var table = $('#datatable-buttons').DataTable();
    var ajaxurl = theurl;   
  var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
  var separator = ajaxurl.indexOf('?') !== -1 ? "&" : "?";
  if (ajaxurl.match(re)) {
    console.log( ajaxurl.replace(re, '$1' + key + "=" + value + '$2'));
    theurl = ajaxurl.replace(re, '$1' + key + "=" + value + '$2');
    table.destroy();
    TableManageButtons.init();

  }
  else {
       console.log( ajaxurl + separator + key + "=" + value);
    theurl =  ajaxurl + separator + key + "=" + value ;
    table.destroy();
    TableManageButtons.init();
  }
}

TableManageButtons.init();

var handleDataTableButtons = function() {


        0 !== $("#datatable-buttons").length && 

    $.ajax( {
  url:theurl,
  dataType: 'json',
  success: function ( json ) {

      $("#datatable-buttons").DataTable({
        "data" : json.data,
        "columns": json.columns,    
            dom: "Bfrtip",
            buttons: [{
                extend: "copy",
                className: "btn-sm"
            }, {
                extend: "csv",
                className: "btn-sm"
            }, {
                extend: "excel",
                className: "btn-sm"
            }, {
                extend: "pdf",
                className: "btn-sm"
            }, {
                extend: "print",
                className: "btn-sm"
            }],
            responsive: !0
        });
         }
} );
    },
    TableManageButtons = function() {
        "use strict";
        return {
            init: function() {
                handleDataTableButtons();
            }
        };
    }();

Answer 1

@guest271314 答案是正确的，应该可以指导您解决有关从getColumns 方法返回未定义的问题。

我只想在这里指出一些关键的事情。

首先调查我刚才创建的plunk。如您所见，这里的所有作用都是操纵 Deferred 对象（有关更多信息，请参阅here）。粗略地解释一下，Deferred 对象可以注册回调，如果您喜欢多个回调，请将它们链接起来，通过调用它们可以广播它们的状态以及它们的响应。它基于 Promise 设计，因此此类方法返回一个 Promise，可以同步或异步解析（大多数时候 Promise 在异步操作中很有用）。

jQuery 的异步方法，例如 $.ajax 返回一个承诺。 $.getJSON 没有什么不同，因为它最后调用 $.ajax，如前所述，它返回一个 jQuery Deferred Promise。

对于 jQuery 的 animation 方法，请参阅下面的 @guest271314 评论。

更多关于承诺here。

来自文档：

返回一个 Promise 对象以观察绑定到集合的特定类型的所有操作（无论是否排队）都已完成。

promise，在处理时会解决或拒绝。 resolve 代表成功响应，reject 代表失败。 从文档中我们可以看到Deferred 对象的方法可以处理成功、失败或两者兼而有之。

deferred.done() 添加延迟对象时要调用的处理程序 解决了。​​

deferred.fail() 添加要在 Deferred 对象被拒绝时调用的处理程序。

deferred.always() 添加要在 Deferred 对象被解析或拒绝时调用的处理程序。

那么，让我们回到 OP 的问题。正如您现在从代码中看到的那样：

function getColumns() {
    $.getJSON('http://myjsonurl', function(json){return JSON.stringify(json.columns); });
}

您无法知道getColumns 状态，因为您不返回promise。当使用 $.getJSON 处理程序时，您实际上是在处理响应而不发出承诺对象。 getColumns 函数当然会返回 undefined，因为没有 return 的符号，默认情况下你会得到它。

关于deferred.then() 方法，您也可以使用它处理promise，处理它的状态和进度。在上面发布的 Plunker 示例代码中，我不关心进度，只关心状态，所以在第一个示例中，promise 使用 .then() 方法处理，第一个函数是成功处理程序，而第二个函数是失败处理程序。从他们那里返回响应本质上意味着承诺得到解决。我也返回了承诺本身。

在注释掉的部分中，您可以看到如果您愿意，您可以只返回承诺并解决 always 方法中的响应

Answer 2

正如@MiguelBolan 所指出的，getColmuns() 没有返回任何值。 return$.getJSON()来自getColumns()；使用.then() 访问从异步函数返回的值

function getColumns() {
  return $.getJSON("http://myjsonurl");
}

getColumns().then(function(json) {
  console.log(JSON.stringify(json.columns))
}
// handle errors
, function err(jqxhr, textStatus, errorThrown) { 
    console.log(textStatus, errorThrown)
}; 

Answer 3

您的getColumns() 函数需要返回变量，目前它只是返回给函数而不是输出。尝试这个： {

function getColumns() {
    var ret;
    $.getJSON('http://myjsonurl', function(json){
          ret = JSON.stringify(json.columns); 
          });
    return ret;
    }