1

我使用 jQuery 终端有这样的代码：

function show() {
    for (var i = 0; i < 100; ++i) {
        this.echo('line ' + i, {
            flush: false
        });
    }
    this.flush();
    setTimeout(function() {
        //this.flush();
    }, 0);
}

var term = $('body').terminal({
    show: show
}, {
    onBlur: function() {
        return false;
    },
    onInit: function(term) {
        show.apply(term);
    }
});

在这个codepen 中，直到我水平调整浏览器窗口的大小，这些行才会显示出来。当我将flush放入setTimeout 0时它起作用：

setTimeout(function() {
    term.flush();
}, 0);

当我在本地服务器上运行相同的代码（没有 setTimeout）时，它可以正常工作。我还尝试将代码嵌入 iframe 中，它也按预期运行。当我执行命令 show （键入 show 并按 enter）时，执行的命令和提示会添加到末尾（在 echo 添加的行之后），但是当我调整窗口大小时，它们应该放在行之前。

有人知道为什么会这样吗？为什么代码在本地和在 codepen 中执行的方式不同？

我已经尝试在 jquery.terminal-src.js 文件中设置断点，但没有弄清楚为什么刷新不显示行。当我单步执行代码时，调用 flush 时 output_buffer 数组似乎是空的，但是当我调整窗口大小并执行调整大小方法时，这些行会以某种方式出现。

4

1 回答 1

2

我相信这是因为该echo函数是异步的。它在Deferred内部使用并记录为

// :: it use $.when so you can echo a promise
// -------------------------------------------------------------
echo: function(string, options) {

由于 Codepen 开销导致的竞争条件（由 codepen 执行的生成代码：注意window.CP自动添加的行）

for (var i = 0; i < 100; ++i) {
    if (window.CP.shouldStopExecution(1)) {
        break;
    }
    this.echo('line ' + i, { flush: false });
}
this.flush();
setTimeout(function () {
}, 0);
window.CP.exitedLoop(1);

然后碰巧resolve的 JQuery Deferred“echo立即”执行，但在调用flush. 因此，当时冲洗不会冲洗任何东西。

设置一个setTimeout队列，flush使其发生在echo.

在我看来，如果他们使用 deferred 作为回声（或任何方法），他们应该调整所有方法来这样做。因此，刷新也应该使用 deferred ，然后将其排队并按顺序解决。

调整窗口大小只是在之后强制刷新，这就是它显示的原因。

顺便说一句，对象创建似乎也被推迟了。因此，如果您term在show方法中使用该变量（而不是在 setTimeout 中），您会注意到它尚未初始化并导致错误。这意味着在变量赋值之前调用 show 函数。这是异步混乱的另一个原因。

于 2016-12-14T21:53:06.420 回答