Javascript浏览器按顺序执行代码
我有一个非常大的对象,它会变成一个非常大的JSON字符串 我有一个点击侦听器Javascript浏览器按顺序执行代码,javascript,ajax,forms,closures,form-data,Javascript,Ajax,Forms,Closures,Form Data,我有一个非常大的对象,它会变成一个非常大的JSON字符串 我有一个点击侦听器 randomElement.addEventListener("click", function(){ console.log("should log immediately"); var content = encodeURIComponent(JSON.stringify(veryLargeJson)); }); veryLargeJson在eventListener范围之外声明/更新 无论出于何
randomElement.addEventListener("click", function(){
console.log("should log immediately");
var content = encodeURIComponent(JSON.stringify(veryLargeJson));
});
veryLargeJson在eventListener范围之外声明/更新
无论出于何种原因,当我单击元素时,浏览器微调器会出现,因为它试图对veryLargeJson进行字符串化,然后对其进行编码,但这是在登录控制台之前发生的
这到底是怎么回事?为什么浏览器执行JSON.stringify时出现了问题
我的第一个想法是,事件侦听器闭包或闭包在一般情况下的工作方式可能是先执行变量声明,或者在其他任何事情发生之前解析所有变量。例如,如果我的超大json是在生成单击的范围之外的范围内声明的,那么浏览器立即尝试解析超大json是什么,这样做会因为json太大而冻结,然后继续打印我的控制台日志,只有在这之后,它才会将其分配给我在侦听器中声明的局部变量
这就是正在发生的事情吗
更新-------------------------------------------------------------------
我把上述问题留作参考
当事件侦听器闭包中有一个formData对象,并且在向formData对象追加非常大的json字符串的情况下发出ajax请求时,就会出现此问题
现在我的问题是,为什么闭包会按顺序计算xhttp.send参数?
randomElement.addEventListener("click", function(){
console.log("should log immediately");
var content = encodeURIComponent(JSON.stringify(veryLargeJson));
var formData = new FormData();
formData.append("whatever", content);
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "https://randomEndpoint", true);
xhttp.setRequestHeader("cache-control", "no-cache");
xhttp.send(formData);
});
浏览器不会进行“无序”处理。除非游戏中有web工作人员,否则所有处理都是在事件处理程序和单线程中完成的 可能发生的情况是,您观察
stringify
调用后出现的控制台日志,但它仍然是在调用之前完成的
当它对您可见时,取决于浏览器的GUI事件循环,通常GUI更新只是排队事件,因此它们必须等待单击的事件完成处理(除非启动嵌套事件循环-Javascript中只有警报
和好友才会发生这种情况)
如果在
stringify
调用前后添加console.log(+new Date())
,您会注意到操作需要很长时间。为什么要将json字符串化?json是一个字符串。什么是浏览器微调器?它是一个json对象。浏览器微调器是指当浏览器正在进行大量工作,并希望阻止用户单击或只是想提醒用户浏览器正在使用JavaScript对象表示法对象时发生的事情?请告诉我您正在使用的术语。@LorenShqipognja,好的,我理解这是一个简单的JavaScript对象。您希望它用JSON表示。对的浏览器微调器是指当浏览器进行大量工作时会发生的事情,您可以附加一个屏幕截图吗?我从未见过本地浏览器微调器。也许你可以创建一个plunker来演示这个问题。您的措辞有点混乱。使用console.log
可以告诉js环境(在本例中是浏览器)记录一些内容。此日志在gui中显示的时间(它实际出现在控制台中的时间)取决于实现,并且可能在内部排队。对象的字符串化显然会阻塞整个浏览器(旋转的轮子),因此也会延迟调试消息的显示。但是这并没有改变这样一个事实,即console.log
是在JSON.stringify(veryLargeJson)
之前执行的。xhttp.send调用导致浏览器挂起,因为负载过大。在更改最初的xhttp.open(“POST”,“randomEndpoint”,false)之后;事实上,在执行post调用时以及在返回之前,我能够看到我的日志语句。