Javascript异步for循环答案

【问题标题】：Javascript asynchronous for loopJavascript异步for循环
【发布时间】：2016-03-11 07:10:34
【问题描述】：

有没有办法让我在 for 循环中异步运行代码？

在本例中，从 x 到 y 天的事件需要通过 for 循环添加到日历中。然而，这个循环大约需要一分钟而且它太长了，因为它需要经过并添加从 2016 年 1 月 4 日到 2020 年 12 月 28 日的所有天数。

现在，我将不得不等待所有天加载才能查看结果。有没有一种方法可以在“addEventSource”被触发后/在它通过所有整个循环之前立即添加和出现事件。是否可以使其异步？

Javascript

$(document).ready(function () {
        loadCalendar(null);
        var start = new Date("Jan 4, 2016 08:00:00");
        var end = new Date("Dec 28, 2020 12:00:00");
        var startTime = new Date("Jan 4, 2016 08:00:00");
        var endTime = new Date("Jan 4, 2016 12:00:00");

        addCalendarEvents("Test", start, end, startTime, endTime);
    });

function addCalendarEvents(title, start, end, repeatDays, startTime, endtime) {
        var events = [];

        var one_day = (24 * 60 * 60 * 1000);
        var loopEnd = end.getTime();

        for (var loop = start.getTime() ; loop <= loopEnd; loop = loop + one_day) {
            var eventDate = new Date(loop);

                var tempStart = start;
                var tempEnd = end;

                tempStart.setDate(eventDate.getDate());
                tempStart.setMonth(eventDate.getMonth());
                tempStart.setFullYear(eventDate.getFullYear());
                tempEnd.setDate(eventDate.getDate());
                tempEnd.setMonth(eventDate.getMonth());
                tempEnd.setFullYear(eventDate.getFullYear());

                $('#calendar').fullCalendar('addEventSource', [{
                    title: title,
                    start: tempStart,
                    end: tempEnd,
                    allDay: false
                }]);

        }
    }

附言$('#calendar').fullCalendar('addEventSource', event) adds events to the calendar.

【问题讨论】：

为什么要一次添加整个日历事件？为什么不只添加观看月份？从服务接收到的详细信息可以存储在本地，以避免每个月更改服务调用
@RavitejaAvvari 这不是唯一的问题，即使只添加观看月份的事件，当需要加载大量事件时仍然需要大量时间。如果有更多的重复事件，问题仍然存在。事件也不能存储在本地，因为它们需要是动态的，我也计划从服务器触发 addCalendarEvents 函数。
如果您的事件已（或将要）存储在您的服务器上，这是检索事件的服务器端业务。客户端（js）你只需要告诉：“嘿，我正在请求从 2018 年 5 月开始的事件，或者其他什么”。向服务器请求它，服务器给你返回事件，然后你显示。我认为你的方法并不像@RavitejaAvvari 所说的那样好，直到 2020 年你才真正“需要”得到一切！

标签： javascript jquery performance for-loop asynchronous

【解决方案1】：

Javascript 没有线程模型，但它有异步计时器。

看看这个：http://www.sitepoint.com/multi-threading-javascript/

【讨论】：

那么我该如何申请呢？你介意输入代码吗？

【解决方案2】：

正如 Tibrogargan 所说，可以使用 setTimeout/setInterval 来实现。

这个想法是运行 for 循环一段时间并打破循环。在从之前停止的位置经过一段时间后再次触发循环。这样你就不会屏蔽用户了。

例如..

var thresholdTime = 500;
function searchForData(searchTerm, indexFromWhereToSearch) {
  var startTime = new Date(),
    searchFrom = indexFromWhereToSearch;
  for (var i=searchFrom; i < hugeData.length; i++) {
    .......
    if (newDate() - startTime >= thresholdTime) {
      setTimeout((function(index) {
        return function() {
          searchForData(searchTerm, index);
        }
      })(i+1), 300/*another threshold*/);
      break/return;
    }
  }
}

【讨论】：

听起来它会起作用，但我是新手，我如何将它应用到我的代码中？你介意为我修改它们吗？谢谢！ :)