Question

此功能在不启动循环的情况下连续运行。

setTimeout用于允许refreshTags函数运行。

我确定这不是写得最好的剧本 - 我不是大师 - 但是关于为什么这个剧本在无限循环中运行的任何想法？

function addTag() 
{
console.log('running'); 
refreshTags(); 
var t = document.getElementById('existingTags').textContent.match(/tag1/); 
var u = 'tag1'; 
if (t == u) {alert('This ticket has already been resolved by our team.')}; 
if (t != u) 
    {
    refreshTags();
    setTimeout(function() 
    {
        document.getElementById('tagToAdd').value = 'tag1';
        document.getElementById('tagSubmit').click(); 
        alert('Ticket resolved!'); 
    }, 2000)
}; 
}

编辑：下面调用addTag的代码。

var resolveButton = document.createElement("a");
resolveButton.href = '#';
resolveButton.innerHTML = '<span>Resolve</span>';
resolveButton.setAttribute("onClick", "addTag()");
resolveButton.setAttribute("type", "button");
resolveButton.setAttribute("class", "button1");

var cha = document.getElementById('chatter_view');
cha.parentNode.insertBefore(resolveButton, cha);

Answer 1

我没有尝试回答为什么这段特殊代码有无限循环，而是试图回答更大的问题“你如何防止和调试无限循环？”。

我发现的最好的防御之一就是构建你的代码，因此控制总是向一个方向流动。这里有许多不同的图层：

onclick事件处理程序正在调用addTag（）
addTag（）正在调用refreshTags（）
addTag（）正在调用setTimeout，稍后会触发对DOM的点击。

保持代码在一个方向上流动的简单方法是创建专用的事件处理程序，例如： resolveButtonOnclick() { addTag() }。 resolveButtonOnclick只能从resolveButton的onclick处理程序中调用。这使得审核代码变得更加容易。您已经将console.log('running')放在addTag（）函数的顶部。现在，如果你在resolveButtonOnclick（）中放入一个console.log（），你就可以立即知道onclick处理程序是否包含在你的无限循环中。

我们看不到你的代码，但是如果refreshTags（）调用addTag（）你会有一个循环控制流 - 这些并不总是坏的，但是你需要格外小心它们在某个时候终止。

您可能拥有的最大循环控制流是addTag（）使用.click（）方法调用DOM。直接从Javascript提交表单或使用XHR会更好，更快，更清晰。

要调试此循环，您就是使用console.log（）的正确轨道。添加更多它们（例如，您调用addTag（）的每个地方）并找出它的调用位置。您可以尝试的另一件事是使用Chrome的DevTools：添加“调试器”;调用addTag（）的顶部并检查堆栈跟踪。

Javascript无限循环没有

1 个答案: