由 http://lifesinger.org/blog/?p=1568
所想
1. javascript 是单线程的,其实只有
xhr是新开了一个线程而已。
第一段代码:
setTimeout(function () {
alert(1);
},
0);
setTimeout(function () {
alert(2);
},
0);
Ext.ajax.request({
url: 'xx.不存在',
failture: function () {
alert(3);
}
});
alert : 会阻塞当前线程
则会先弹出1(不要点确定),等会弹出3,而2只有点击 1,3 都确定后才会弹出
第二段代码:
setTimeout(function () {
for (var i = 0; i < 2000; i++)
console.log(' main thread ' + i);
},
0);
setTimeout(function () {
for (var i = 0; i < 1000; i++)
console.log(' main thread-2 ' + i);
},
0);
Ext.ajax.request({
url: 'xx.不存在',
failture: function () {
alert(3);
for (var i = 0; i < 100; i++)
console.log(' sub thread ' + i);
alert(4);
}
});
则会 先打印main thread 0,main thread 1,.... 还没到
main thread
1999
时 就 alert(3) ,点确认后
alert(4) ,
注意其间
main thread 打印 一直没停,
一直
到 main thread 1999 , 然后 main thread-2 0
main thread-2 1
一直到
main thread-2 999
,然后 才是 sub thread 0 ....sub thread 99 ,可见只有 ajax 的回调 alert 先弹出了 (与alert 顺序无关),他后面的操作 放在 javascript单线程事件 队列里面
------------------------------------------总结一下
可能不太对,
第二段代码 在 ff 中表现如上,在ie 中 装了
Companion.JS,但是不太准确(打印了3000个log后才弹出alert(3))
故:看见 alert 操作很特殊 可能与事件队列无关,ajax 是新开一个线程 ,返回时,处理函数放在javascript
事件队列的末尾,但里面的 alert 不管顺序挨各先执行.(对应第二段代码)
ajax 回调的alert 可插在 原先的 alert 后面 ,而 原先alert后面的alert 则要等
ajax 回调的alert 点击确定后才能执行。
(对应第一段代码)
2.ie element 的事件添加为
栈
先进后出,其他浏览器为
队列
后进后出,不过
setTimeout 都一样的,把定时运行函数放在当前所有操作的最后处理。
测试代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>singleThread 测试</title>
<script type="text/javascript" src="ext-base.js"></script>
<script type="text/javascript" src="ext-core.js"></script>
<script type="text/javascript">
//<![CDATA[
var no=0;
Ext.onReady(function() {
Ext.get('t').on('click',function(){
setTimeout(function(){
alert('first click timeout ok');
},0);
alert('first click');
Ext.getDom('debug').innerHTML+=1+'<br />'
});
Ext.get('t').on('click',function(){
alert('second click');
Ext.getDom('debug').innerHTML+=2+'<br />'
});
});
//]]>
</script>
</head>
<body>
<input type='button' id='t' value='click me please' />
<div id='debug'>
</div>
</body>
</html>
- 大小: 328.2 KB
分享到:
相关推荐
主要介绍了解决vue 使用setTimeout,离开当前路由setTimeout未销毁的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
主要介绍了js基于setTimeout与setInterval实现多线程的方法,分析了多线程的原理与javascript模拟实现多线程的相关技巧,需要的朋友可以参考下
关于JS定时器(setTimeout setInterval)定时不准问题1
setTimeout()从载入后延迟指定的时间去执行一个表达式或者是函数;仅执行一次 ;和window.clearTimeout一起使用.我在 代码如下:$(document).ready(function(){setTimout(test(),200); function test() { alert(1&#...
NULL 博文链接:https://rainbow702.iteye.com/blog/1668935
setTimeout 描述 setTimeout(code,millisec) setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。 注:调用过程中,可以使用clearTimeout(id_of_settimeout)终止 参数 描述 code 必需,要调用的...
setTimeout,javascript 延时执行函数,闭包处理 利用javascript闭包处理延时操作
解决方法如下: 1、定义一个self暂存this ...拓展知识:解决vue在setTimeout内修改this失效的问题 当在vue中使用定时器来修改一个变量值的时候,发现没有效果,这是由于setTimeout函数调用的代码运行在与所
给c#添加SetTimeout和SetInterval函数.docx
使用javascript方法settimeout()函数来定时跳转页面。
使用SetInterval和设定延时函数setTimeout 很类似。setTimeout 运用在延迟一段时间,再进行某项操作。
最近做一个项目,遇到了一个问题同步ajax引起的ui线程阻塞问题,下面把我的问题解决过程分享给大家。 事情起因是这样的,因为页面上有多个相似的异步请求动作,本着提高代码可重用性的原则,我封装了一个名为getData...
Javascript定时器(二)——setTimeout与setInterval 在 http://www.cnblogs.com/strick/p/3983904.html 有说明
java后台定时器最简单用法实例,类似于js里的setTimeOut
一、setTimeout那些事儿之单线程 一直以来,大家都在说Javascript是单线程,浏览器无论在什么时候,都且只有一个线程在运行JavaScript程序。 但是,不知道大家有疑问没——就是我们在编程过程中的setTimeout...
使用setTimeout()方法模拟进度条
围绕setTimeout的一个微型(28字节)Promise封装
主要介绍了微信小程序—setTimeOut定时器的问题及解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下