通过匿名函数使用 setInterval 的更好方法

Question

我有一个从服务器获取对象数组并将它们显示在列表中的代码。在这里一切正常，除了我觉得代码草率且效率低下。我可以在我的 AJAX 调用中的某处实现 setInterval 以便最后不调用 setInterval 吗？此外，如果我在我的代码中调用 setInterval，我如何才能让 AJAX 调用刷新，但在页面打开后立即显示我从服务器获取的字符串？我对 AJAX 和 jQuery（尝试 AJAX 的第一天）非常陌生，因此非常感谢任何语法/缩进编辑！

function displayMessages(messages){
  $('.messages').append('<li>' + messages + '</li>');
}
function fetchMessages(){
  $.ajax({type: "GET",
  url: "https://api.parse.com/1/classes/chats",
    success: function(data) { 
      for(var i = 0 ; i < 10; i++){
        displayMessages(data.results[i].text);
        if($('.messages li').length > 10){
          $('.messages li').first().remove();
        }
      }
    }

  });
}
fetchMessages();
setInterval(fetchMessages,3000);

Answer 1

您可能对这里的解决方案感兴趣； JavaScript: How to get setInterval() to start now?

这使您可以使用立即调用的匿名函数，然后在间隔定期调用：

function setIntervalAndExecute(fn, t) {
    fn();
    return setInterval(fn, t);
}

你可以这样使用它：

var timer = setIntervalAndExecute(function() {
    $.ajax({
        type: "GET",
        url: "https://api.parse.com/1/classes/chats",
        success: function(data) { 
            for (var i = 0; i < 10; i++) {
                displayMessages(data.results[i].text);
                var msgs = $('.messages li');
                if (msgs.length > 10) {
                    msgs.first().remove();
                }
            }
        }
    });
}, 5000);

附：您还遗漏了 setInterval 的第二个参数，即间隔的毫秒数。

Answer 2

首先你的syntax 是错误的。

setInterval(fetchMessages); //wrong

更好的方法是使用变量，以便您可以在需要时暂停/清除它

fetchMessages();
var interval = setInterval(fetchMessages, 60000);  //run every 1 minute
clearInterval(interval);  //This helps to pause the continuous function