Javascript 'console' 无限循环

Question

我正在试验 javascript 程序，但遇到了障碍。该程序突然滞后于我的浏览器(可能是无限循环)，不知道为什么。

function fullscreen() {
    if (document.body.requestFullScreen) {document.body.requestFullScreen();}
    else if (document.body.webkitRequestFullScreen) {document.body.webkitRequestFullScreen();}
    else if (document.body.mozRequestFullScreen) {document.body.mozRequestFullScreen();}
}

var bash = document.createElement('span');
bash.setAttribute('id', 'bash');
document.body.appendChild(bash);

var cursor = document.createElement('span');
cursor.setAttribute('id', 'bashCursor');
cursor.textContent = '_';
cursor.style.display = 'none';
cursor.style.fontWeight = 'bold';
document.body.appendChild(cursor);

window.Bash = {};
window.Bash.printing = false;
window.Bash.queue = Array();
window.Bash.span = bash;
window.Bash.span.cursor = cursor;

delete bash; delete bash;


function bashPrint() {
    window.Bash.writing = true;
    var bash = window.Bash.span
    var i;
    while (window.Bash.queue.length) {
        if (window.Bash.queue[0] == undefined) {
            i = 0;
            while (i < window.Bash.queue.length) {
                window.Bash.queue[i] = window.Bash.queue[i+1];
                console.log('l:'+window.Bash.queue.length);
                console.log(window.Bash.queue);
                delete window.Bash.queue[i+1];
                window.Bash.queue.splice(i,1);
                i++;
            }

        } else if (window.Bash.queue[0]['type'] == 'instant') {
            bash.textContent += window.Bash.queue[0]['value'];
            delete window.Bash.queue[0];
            window.Bash.queue.splice(0,1);

        } else if (window.Bash.queue[0]['type'] == 'wait') {
            setTimeout(bashPrintWaiting, window.Bash.queue[0]['wait']);
            break;

        } else if (window.Bash.queue[0]['type'] == 'cursor') {
            if (window.Bash.queue[0]['value']) {
                window.Bash.span.cursor.style.display = 'inline';
            } else {
                window.Bash.span.cursor.style.display = 'none';
            }
        }
    }
    window.Bash.writing = false;
}

function bashPrintWaiting() {
    window.Bash.writing = true;
    var bash = window.Bash.span;
    bash.textContent += window.Bash.queue[0]['value'];
    delete window.Bash.queue[0];
    window.Bash.queue.splice(0,1);
    window.Bash.writing = false;
    setTimeout(bashPrint, 0);
}

function bashWrite(string) {
    var array = Array();
    array['type'] = 'instant';
    array['value'] = string;
    window.Bash.queue[window.Bash.queue.length] = array
}

function bashPause(times, string) {
    if (!string) {string='';}
    while (times > 0) {
        var array = Array();
        array['type'] = 'wait';
        array['value'] = string;
        array['wait'] = 50 + Math.floor(Math.random()*450);
        window.Bash.queue[window.Bash.queue.length] = array;
        times--;
    }
}

function bashCursor(enabled) {
    var array = Array();
    array['type'] = 'cursor';
    array['value'] = enabled;
    window.Bash.queue[window.Bash.queue.length] = array;
}

bashWrite('Uncompressing');
bashPause(12, '.');
bashWrite('OK\n');

bashPause(3);
bashWrite('Build v. 0.1.01-release (x86_64-pc)\n');

bashPause(2);
bashWrite('Connecting');
bashPause(35, '.');
bashWrite('Error, unknown user. See connect.log for futher information.\n');

bashPause(2);
bashWrite('none@m ~ $ >>');
bashCursor(true);

bashPrint();

我上传到 jsFiddle - http://jsfiddle.net/uQcCP/

程序在以下时间卡住:

bashWrite('Error, unknown user. See connect.log for futher information.\n');

和

bashPause(2);

拜托，你能帮帮我吗？非常感谢。

Answer 1

无限循环从第 51 行开始:while (window.Bash.queue.length) {

然后它在第 74 行的 if 语句中结束，在此队列中永远不会缩短:

else if (window.Bash.queue[0]['type'] == 'cursor') {
   if (window.Bash.queue[0]['value']) {
      window.Bash.span.cursor.style.display = 'inline';

如果您发现自己在 Chrome 中遇到无限循环问题，请打开您的开发工具并在打开页面之前转到脚本选项卡。打开页面并开始循环后，您可以单击暂停按钮在代码当前正在执行的位置抛出一个断点。从那里可以更容易地判断您在哪里遇到错误。