Question

我通常喜欢组织我的代码，以便一个函数可以触发其他一些代码功能，像这样：

/**
 * GET MESSAGES:
 */
$(function() {
  $.ajax({
    url: '/messages',
    method: 'GET',
    dataType: 'json',
    success: function(messages) {
      if (messages.length > 0) {
        keyedMessages = keyFork(messages);
        reversedMessages = reverse(keyedMessages);
        crushedMessages = crush(reversedMessages);
        getFriendships(messages, crushedMessages);
      }
      mail.template.airmail();
    }
  });
});

但是，如果我需要在其中一个嵌套中执行第二个Ajax请求函数由于Ajax请求的范围，我无法返回数据它使我的代码不一致，难以理解，在整个地方分解。例如，如果其中一个功能上面调用的是我写的第二个Ajax请求友谊之后由于请求将从通信链中断开，似乎无法返回任何内容：

/**
 * GET FRIENDSHIPS:
 */
function getFriendships(messages, crushedMessages) {
  $.ajax({
    url: 'friendships',
    method: 'get',
    dataType: 'json',
    success: function(friendships) {
      addKey(crushedMessages, friendships);
      filteredCrushedMessages = filterUnconfirmedSender(crushedMessages);
      filteredCrushedMessages.forEach(function(filteredCrushedMessage) {
        mail.sidebar.builder.messengers(filteredCrushedMessage);
      });
      mail.snailMail.onload();
    }
  });
}

如果我尝试返回数据，则无效。因此我必须这样做继续调用嵌套请求中的函数，每次我需要创建另一个嵌套的ajax请求时它会破坏链。这让我的代码很难阅读。有没有解决这个问题的方法或者是使用Ajax请求的代码难以阅读？

Answer 1

您可以将数据存储在DOM元素上，然后使用jQuery Custom Events来完成它。

甚至支持将参数传递给您的事件处理程序： https://learn.jquery.com/events/introduction-to-custom-events/#naming-custom-events

Answer 2

如果我尝试返回数据，它就无法正常工作。

问题中的任何一个函数都没有返回jQuery promise吗？

尝试使用return语句$.when.apply(this, arrayOfPromises)从getFriendships返回jQuery promise对象数组

function getFriendships(messages, crushedMessages) {
  return $.ajax({
    url: 'friendships',
    method: 'get',
    dataType: 'json',
    success: function(friendships) {
      addKey(crushedMessages, friendships);
      filteredCrushedMessages = filterUnconfirmedSender(crushedMessages);          
      mail.snailMail.onload();
      return $.when.apply($
        , filteredCrushedMessages.map(function(filteredCrushedMessage) {
            return mail.sidebar.builder.messengers(filteredCrushedMessage);
          })
      );
    }
  });
}
// e.g., 
getFriendships(messages, crushedMessages)
.then(function success() {
  console.log(arguments)
}, function err(jqxhr, textStatus, errorThrown) {
  console.log(errorThrown)
})

嵌套ajax请求会使代码难以阅读

2 个答案: