在setInterval中返回值 [英] Return value inside a setInterval

问题描述

我想在setInterval中返回一个值。我只是想用时间间隔执行一些事情，这就是我尝试过的事情：

I want to return a value inside a setInterval. I just want to execute something with time interval and here's what I've tried:

function git(limit) {
    var i = 0;
    var git = setInterval(function () {
        console.log(i);
        if (i === limit - 1) {
            clearInterval(git);
            return 'done';
        }
        i++;
    }, 800);
}

var x = git(5);
console.log(x);

它不起作用。
还有其他方法吗？

And it's not working. Is there any other way?

我要做的是在特定时间间隔内制作动画。然后当我达到极限时（例如 5x闪烁$（）。fadeOut（）。fadeIn（）），我想返回一个值。

What I'm going to do with this is to do an animation for specific time interval. Then when i reached the limit (ex. 5x blink by $().fadeOut().fadeIn()), I want to return a value.

这是应用程序：

function func_a(limit) {
    var i = 0;
    var defer = $.Deferred();
    var x = setInterval(function () {
        $('#output').append('A Running Function ' + i + '<br />');

        if (i == limit) {
            $('#output').append('A Done Function A:' + i + '<br /><br />');
            clearInterval(x);
            defer.resolve('B');
        }
        i++;

    }, 500);
    return defer;
}

function func_b(limit) {
    var c = 0;
    var defer = $.Deferred();
    var y = setInterval(function () {
        $('#output').append('B Running Function ' + c + '<br />');

        if (c == limit) {
            $('#output').append('B Done Function B:' + c + '<br /><br />');
            clearInterval(y);
            defer.resolve('A');
        }
        c++;

    }, 500);
    return defer;
}

func_a(3).then( func_b(5) ).then( func_a(2) );

这不能很好地运作，它应该打印 A，A，A，完成A，B，B，B，B，B，完成B，A，A，完成A 但是在这里它被扰乱并且似乎延迟运行所有功能而不是之后另一个但同时。这就是我问这个问题的原因，因为我想在我的中返回 return defer; if ...

This is not functioning well, it should print A,A,A,Done A,B,B,B,B,B,Done B,A,A,Done A but here it is scrambled and seems the defer runs all function not one after the other but simultaneously. That's why I asked this question because I want to return return defer; inside my if...

if (i == limit) {
     $('#output').append('A Done Function A:' + i + '<br /><br />');
     clearInterval(x);
     defer.resolve('B');
     // planning to put return here instead below but this is not working
     return defer;
}

推荐答案

您是否期望等待直到间隔结束？这对运行时来说真的很痛苦，你会阻止整个页面。 JS中的很多东西都是异步的，所以你必须使用回调，承诺或类似的东西：

Do you expect it to wait until the interval ends? That would be a real pain for the runtime, you would block the whole page. Lots of thing in JS are asynchronous these days so you have to use callback, promise or something like that:

function git(limit, callback) {
    var i = 0;
    var git = setInterval(function () {
        console.log(i);
        if (i === limit - 1) {
            clearInterval(git);
            callback('done');
        }
        i++;
    }, 800);
}

git(5, function (x) {
  console.log(x);
});

使用承诺看起来像这样：

Using a promise it would look like this:

function git(limit, callback) {
    var i = 0, promise = new Promise();
    var git = setInterval(function () {
        console.log(i);
        if (i === limit - 1) {
            clearInterval(git);
            promise.resolve('done');
        }
        i++;
    }, 800);

    return promise;
}

git(5)
  .then(function (x) {
    console.log(x);

    var promise = new Promise();
    setTimeout(function () { promise.resolve("hello"); }, 1000);

    return promise;
  })
  .then(function (y) {
    console.log(y); // "hello" after 1000 milliseconds
  });

编辑：为承诺创建添加了伪示例

Added pseudo-example for promise creation

Edit2：使用两个承诺

Using two promises

这篇关于在setInterval中返回值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！