码迷,mamicode.com
首页 > 编程语言 > 详细

javascript 单线程之一

时间:2014-06-04 18:14:15      阅读:329      评论:0      收藏:0      [点我收藏+]

标签:c   style   class   blog   code   java   

初次接触到javascript的单线程。

bubuko.com,布布扣
 1     <button id="do">计算器</button>
 2     <div id="status"></div>
 3 
 4     <script type="text/javascript">
 5         var $=function(id){
 6             return document.getElementById(id);
 7         };
 8 
 9         $(‘do‘).onclick=function(){
10             $(‘status‘).innerHTML="正在计算.........."; //这里根本就没有去做 ??
11             long();
12         };
13 
14         var long=function(){
15             var  result=0;
16             for(var i=0; i< 1000; i++){
17                 for(var j=0; j<1000; j++){
18                     for(var k=0; k<1000; k++){
19                         result+=i+j+k;
20                     }
21                 }
22             }
23             $(‘status‘).innerHTML=‘计算完成‘;
24         };
25 
26 
27     </script>
bubuko.com,布布扣

测试结果是:正在计算这几个字根本就没显示,直接显示计算完成。

后来分析原因,当点击事件发生时,浏览器事件触发线程 向Event Loop 中添加了点击事件,javascript引擎线程 在处理完点击事件后,继续执行下边的

long()函数,直到 javascript引擎线程 执行完函数后,界面渲染线程 才有机会执行界面重绘,结果就是N秒之后,才显示“计算完成”。

 

 

javascript 单线程之一,布布扣,bubuko.com

javascript 单线程之一

标签:c   style   class   blog   code   java   

原文地址:http://www.cnblogs.com/su27ubk/p/3759751.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!