异步任务完成后通知 [英] Notify after async task is done

问题描述

我正在使用move.js制作游戏的动画，但是它花费的时间太长，因此当玩家单击正确的解决方案时，它会在正确的解决方案更改其颜色之前显示获胜消息，因此我使用了延迟对象触发一个事件，并在动画结束时捕获它.

I'm building a game with move.js for animation, but it takes too long so when the player click on the right solution it displays the winning message before the right solution change it's color, so I used deferred object to fire an event and catch it when the animation ends.

这是我的代码:

var deferred = new $.Deferred();
click(e);
//show message when game is over
$.when(deferred).then(function(){
    if (this.checkIfWin()){
        alert('you won !');
        this.nextLevel();
    }
});
function click(e){
    move(e)
    .set('background-color','black')
    .delay('0.1s')
    .end();
    deferred.notify();
}

但是它没有得到通知，消息也没有显示.我在这里想念什么?

but it's not notified and the message doesn't show up.What am I missing here ?

推荐答案

由于javascript中的动画是异步的(它们是通过计时器运行的)，因此知道它们何时完成的唯一方法是挂接到某种完成回调或完成中通知.

Because animations in javascript are asynchronous (they run via timers), the only way to know when they are done is to hook into some sort of completion callback or completion notification.

我自己不知道move.js，但是看起来您可以通过为.end(fn)方法提供回调来获得这样的回调.但是，您还必须修复您的代码，因为this.checkIfWin()中的this在这两个代码块中都不是正确的值.我不知道您想要什么(因为您没有显示代码的那一部分)，但是您必须引用this以外的其他对象.无论如何，这是使用和不使用延迟的代码的一般结构.

I don't know move.js myself, but it looks like you can get such a callback by supplying a callback to the .end(fn) method. But, you will also have to fix your code because this in this.checkIfWin() will not be the right value in either of these code blocks. I don't know what you want it to be (since you don't show that part of your code), but you will have to refer to some other object besides this. In any case, here's the general structure of the code both with and without the use of a deferred.

var deferred = new $.Deferred();

// your code was using this here 
// so I will save a reference to it that can be used later, but there is
// probably a better way to do this if I could see the rest of your code
var obj = this;

click(e);

//show message when game is over
deferred.promise().then(function(){
    if (obj.checkIfWin()){
        alert('you won !');
        obj.nextLevel();
    }
});

function click(e){
    move(e)
    .set('background-color','black')
    .delay('0.1s')
    .end(function() {
        deferred.resolve();
    });
}

---

在这种情况下，您似乎并不需要真正使用deferred，因为您可以将完成代码放在回调中:

---

In this case, it doesn't look like you really need to use the deferred as you could just put the completion code right in the callback:

// your code was using this here 
// so I will save a reference to it that can be used later, but there is
// probably a better way to do this if I could see the rest of your code
var obj = this;

click(e);

function click(e){
    move(e)
    .set('background-color','black')
    .delay('0.1s')
    .end(function() {
        if (obj.checkIfWin()){
            alert('you won !');
            obj.nextLevel();
        }
    });
}

这篇关于异步任务完成后通知的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！