为图表数据刷新器添加 JavaScript 闭包

Question

这是一个脚本，可以为图表获取数据并每 30 秒重复一次该操作。问题是存在内存泄漏，一些研究告诉我我需要添加一个 JavaScript 闭包。但是，由于我对 JavaScript 不是很熟悉，所以我没能成功。

这是我上次尝试的结果：

fetch('log_chart.txt')
    .then(function (response) {
        return response.text();
    })
    .then(function (text) {
        let series = csvToSeries(text);
        renderChart(series);
    setTimeout(trigger, 30000);
    })
    .catch(function (error) {
        console.log(error);
    });

  function trigger() {
    setTimeout(function (){
      fetch('log_chart.txt')
      .then(function (response) {
      return response.text();
      })
      .then(function (text) {
      let series = csvToSeries(text);
      renderChart(series);
      })
        .catch(function (error) {
      console.log(error);
    }, 30000);
    });
  }

第一部分获取数据并渲染图表，同时设置为30秒后重复。第二部要重复上面的，不能停

问题是它在第二次更新后停止了 - 所以第二次 setTimeout 没有像我预期的那样工作。

我应该怎么做呢？

Answer 1

在这种情况下，您应该改用 setInterval，它每 x 秒运行一次特定函数。它还应该解决您的内存泄漏问题，这可能是由使用 setTimeout 引起的，因为它是异步的，这意味着代码继续添加越来越多的 setTimeout 而仍然是运行其他代码。这会占用不必要的内存。更多相关信息：How does setTimeout() create a memory leak in this code?

至于解决方案：

function trigger() {
    fetch("log_chart.txt")
        .then(function (response) {
            return response.text();
        })
        .then(function (text) {
            let series = csvToSeries(text);
            renderChart(series);
        })
        .catch(function (error) {
            console.log(error);
        });
}

trigger()
setInterval(trigger, 30000)

为图表数据刷新器添加 JavaScript 闭包

Adding JavaScript closure to chart data refresher

javascript

closures