Javascript 建模a"；问答游戏；作为异步；“长时间运行过程”；

许多人将他们的应用程序建模为一长串回调，调用流程中的下一步。我尽量避免这样。我正在做一个在培训网站上弹出的“测验”。我正在使用when/then范式启动一切，我喜欢它的外观：

$.when(
    quiz_getQuizData(courseId),
    quiz_loadDependencies()
).then(function(){
    quiz_prepareData();
    $.when(
        quiz_buildPage(target)
    ).then(function(){
        quiz_initEventHandlers();
        quiz_start();
        [here?]
    });
});

它清楚地表明，首先获取数据和依赖项，然后准备数据并构建页面，然后初始化事件处理程序并开始测试

如果我进一步扩展，使“参加测验”成为一个异步过程，会怎么样？目前，我有一个回调函数，当某个函数决定测试完成时，它将调用该回调函数。但为了在一个地方展示测验的整个生命周期，或许我应该补充一点

$.when(
    quiz_getResponses()   /* <-- user takes 20 min to answer some questions*/
).then(function(){
    $.when(
        quiz_submit()
    ).then(function(){
        quiz_finish();
        callback();
    });
});

---

不，图案很好。等待用户输入是一项异步任务，可以（而且应该）用承诺建模

问题是，quick_getResponses实际上只是创建一个延迟对象，然后代码中某个地方的“I'm done”按钮就会解决它。我不喜欢它，因为getResponses实际上什么都不做。而且要找出谁在“解决”这个对象仍然有些困难

您的

quick\u getResponses

函数应该创建并显示该按钮，并在其上安装click listener（如果您想将该按钮放入HTML中，则至少安装后者）。它甚至可以在点击按钮（或测验超时等）后清理按钮

---

事实上，创建一个全局延迟并让任意单击处理程序（实际上是任何东西）解析它是一种反模式。按钮代码不应该在“某处”，而是在

quick\u getResponses

函数中。

Q promises是目前为止最常用的best@Vinz243等等什么？（不管v2 Q Promission有多旧、有多慢，而且很快就会被彻底检修——这与此处的任何内容有什么关系？）提示：当您只有一个函数返回promise时，请避免使用

$.when（）

。另外，你应该删除

回调

的东西，取而代之的是

返回

承诺书。谢谢，我想我离目标不远了。buildPage应该构建所有html，而initEventHandlers应该为所有可点击的内容连接处理程序。但是按照您的逻辑，我认为我应该让getResponses实际添加“我完成了”单击的处理程序。我唯一不喜欢的是initEventHandlers然后会将函数连接到事件，除了一个按钮，如果您转到该函数查找谁在处理“我完成了”单击，这可能会让人困惑。也许有一个“评论”就足够了。你还安排了哪些活动？我要说的是，如果它们只是用于显示，那么它们应该进入

构建页面
；如果它们是关于控制流中的操作（中止测验、选择单个响应等等），那么您应该为它们构建自己的承诺。您还可以让
build\u page
完成所有工作，并返回一个包含来自它的承诺的对象。我有您可以单击的任何东西，以及处理它的方法。像
$（'quick'）。在（'click'，'single choice'，quick\u singleChoice\u click）除了“我完成了”和“退出”之外，都只是界面上的东西。所以我想我也应该在“获取响应”中处理“退出”？注意：它们不在buildPage中，只是因为buildPage是异步的，处理程序需要在之后连接。（但我当然可以把它们放在那里）啊，我明白了，我不知道
build\u page
到底做什么。是的，
退出
听起来也是一个很好的承诺候选人。
$.when(
        quiz_getQuizData(quizOptions['courseId']),/* submit courseId, wait for quiz data (questions, choices) */
        quiz_loadDependencies()                   /* wait for yepnope to load javascript and css dependencies */
    ).then(function(){
        quiz_prepareData();                       /* build object for rendering quiz template                 */ 
        $.when(
            quiz_buildPage(targetSelector)        /* wait for template, render page into target               */
        ).then(function(){
            quiz_initEventHandlers();             /* add handlers to click events                             */
            quiz_start();                         /* do any final preparations, show the quiz                 */ 
            $.when(
                quiz_getResponses()               /* wait for user to answer questions (or time run out)      */
            ).then(function(){
                $.when(
                    quiz_getResults()             /* submit responses, wait for results                       */
                ).then(function(){
                    $.when(
                        quiz_showResults()        /* show results, wait for user to close                     */
                    ).then(function(){
                        var result=quiz_finish(); /* do any final operations, hide and destroy the quiz       */
                        callback(result);         /* notify page that quiz is over, send result               */
                    });
                });
            });
        });
    });