Question

这是指向我的代码的链接：https://jsfiddle.net/SpringLeader/vt56fy85/12/

我为一所学校制作了一个西蒙启发的记忆游戏，但是当我按下开始按钮时，我的凌乱的JavaScript代码会冻结。我不是网络编程方面的专家，我还在教自己。

这是它开始的地方（点击开始按钮时）

document.getElementById("uibtn").onclick = function(){
    var uibtn = e('uibtn');
    uibtn.remove("uibtn");
    removeHeader();
}

它会删除开始按钮并跳转到“删除标题”＆＃39;功能

function removeHeader(){
    var rndhdr = e('rndhdr');
    var rndv1 = rndhdr.childNodes;
    while(rndv1.length >= 1){
        rndv1[0].remove();
    }
    createHeader();
}

此部分不完整，并检查现有的圆形计数器（例如＆＃39;第1轮和第39页）并删除它。然后调用createHeader（）。

function createHeader(){
    var rndhdr = e('rndhdr');
    var hdr = document.createElement('h');
    hdr.setAttribute('id', 'hdr');
    hdr.setAttribute('class', 'hc');
    hdr.innerHTML = "<h>Round 1</h>";
    rndhdr.appendChild(hdr);
    Game();
}

此功能会放置一个新的圆形标题，第1轮和第39页。这将根据用户完成的轮数而改变，但该部分尚未添加。

function Game(){
    var corct = true;
    while(corct == true){
        var newcol = Math.floor((Math.random() * 4) + 1);
        sofar = newcol.toString() + sofar;
        Flashing(sofar);
    }
}

此部分生成与按钮（分别为绿色，红色，蓝色和黄色）对应的数字1到4，并将其添加到包含生成的所有数字的数组中。然后它跳到Flashing（）函数。

function Flashing(){
    thr = sofar.length;
    while(sofar[thr] > -1){
        var btn = sel(sofar[thr]);
        btn.style.borderColor = "white";
        blinking = true;
        setTimeout(function(){Flash(btn);}, 2000);
        thr--;
    }
    Game();  
}

function Flash(el){
    el.style.borderColor = el.style.backgroundColor;
    blinking = false;
}

此函数获取sofar []数组中的字符串数，然后调用Flash（），闪烁列表中的按钮各2秒。

我在尝试重新调整代码时尝试了一下，现在我的调用堆栈大小已经超过了。我不知道为什么会破坏......

Answer 1

这个答案是在编辑问题之前写的。我相信它仍然解决了问题的关键。

当我将代码重新构建到一个独立的页面并运行它时，Firefox警告我没有响应的脚本。杀死它会显示它在控制台中终止的行。看那里，我看到

while(running == true){

在该循环中（或者，实际上，在脚本中的任何位置）没有任何内容将running设置为false。加，

while(blinking = true){}

是一个有保证的无限循环。在上面，你还有另一个无限循环

while(corct == true){

只要Javascript引擎运行您的代码，浏览器就会无法响应。无限循环不会在Web浏览器中飞行。

_{此外，您很难阅读您的代码。请使用更多元音。}

当我按下开始按钮时，为什么我的脚本会冻结？

1 个答案: