javascript - 不使用递归创建 jquery 无限动画？

Question

如何使用jquery制作无限动画，但不使用递归方式？

我找到的递归解法:jQuery .animate() callback infinite loop

使用递归的问题是:动画时，当前页面的浏览器选项卡将占用越来越多的内存。

Answer 1

您实际上错误地认为代码是“递归的”。它不是递归的。您的评论“当前页面的浏览器选项卡将占用越来越多的内存。”不是因为该代码中的任何递归。如果你每秒有一次内存泄漏(根据你的评论)，那么问题出在别处。

代码实例实际上是按顺序运行的，不是通过嵌套堆栈调用(即线性而非递归)。

使用您链接到的最基本示例:

function start() {
    $('#element').animate({}, 5000, 'linear', start);
}
start();

这是实际发生的事情:

• 定义了一个名为start 的函数，然后调用一次
• 在start中，开始一个动画操作，然后start立即退出!
• animate 只是将信息添加到元素的单个动画队列，然后返回。
• 动画队列由单独的进程(单个计时器等)逐步处理。
• 当排队的条目达到其预期的结束状态时，它会调用回调 - 存储在排队条目中的全局 start 函数。
• 这很简单，在动画队列中添加另一个条目并退出。

基本上代码看起来是递归的，但由于操作是异步的，通过队列，它不是递归的。我不知道这些是否有正式名称，所以我只是称它们为链式回调。