Question

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

在此示例中，需要通过for循环将日期 x 到 y 的事件添加到日历中。然而，这个循环大约花了一分钟而且太长了，因为它需要经过并添加从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
                }]);

        }
    }

P.S。 $('#calendar').fullCalendar('addEventSource', event) adds events to the calendar.

Answer 1

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

检查出来：http://www.sitepoint.com/multi-threading-javascript/

Answer 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;
    }
  }
}

Javascript异步for循环

2 个答案: