javaScript之setTimeOut() -

Lixh1986

浏览: 1107162 次

最近访客更多访客>>

Z865785437029

akingde

ningzong

蕃薯耀

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

javaScript之setTimeOut()

博客分类：

javaScript

javascript setTimeOut

在使用 setTimeout 時，假設要執行 4 次就如同下面的例子：

for (var i = 0; i < 4; i++)
  {
      console.log("A="+i);
      function A(){
          console.log("B="+i);
      }
      window.setTimeout(A, 0);

  }

一般常理判斷結果應該是：
A=0
B=0
A=1
B=1
A=2
B=2
A=3
B=3

實際結果如下：
A=0
A=1
A=2
A=3
B=4
B=4
B=4
B=4

有沒有覺得很奇怪?

這是因為 javascript 屬於單執行序，看起來 window.setTimeout(A, 0); 似乎是馬上執行，但是實際上， for 迴圈裡的 setTimeout 會先放在代執行的堆疊裡，直到 for 迴圈結束，但如此一來到結束時，i 即為 4，所以結果就是堆疊裡的每個待執行任務中的 i 都為 4。

所以比較好的寫法應該是：

<html>
        <head>           
            <script style='javascript' src=''></script>            
        </head>
    <body >


        <script type="text/javascript">
          var i = 0;
          function doAppend(){
              if (i++ >= 4){
                  return;
              }
              console.log("B="+i);
              setTimeout(doAppend, 0);
          }//函数定义。只是定义，没有执行。
          console.log(i);//i=0
          setTimeout(doAppend, 0);//开始执行
         
        </script>
    </body>
</html>

跟上面的例子有什麼不同？上面的 setTimeout 每個是獨立的，這個例子的 setTimeout 將一環接著一環，如此一來，每個 setTimeout 都會有正確的 i 了

-

另外一旦我們想要清除定時器，可以通過將定時時產生的ID標識傳遞給clearTimeout或者clearInterval函數來清除定時，至於使用哪個函數取決於調用的時候使用的是setTimeout還是setInterval。範例如下：

var id = setTimeout ( foo ,  1000 ); 
clearTimeout ( id );

假設我們要清除所有定時器，但由於沒有內置的清除所有定時器的方法，可以採用一種暴力的方式來達到這一目的。

//清空"所有"的定時器
for ( var i =  1 ; i <  1000 ; i ++)  { 
    clearTimeout ( i ); 
}

可能還有些定時器不會在上面代碼中被清除（如果定時器調用時返回的ID值大於1000），因此我們可以事先保存所有的定時器ID，然後一把清除。

ref:
1、Javascript: setTimeout
http://smlsun.com/blog/2013/02/01/javascript-settimeout/

2、JavaScript可否多線程? 深入理解JavaScript定時機制
http://www.phpv.net/html/1700.html

-

分享到：

position=absolute之相对父元素定位 | javaScript之function定义

2013-09-26 17:34
浏览 1271
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

javaScript之setTimeOut()

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

javaScript之setTimeOut()

评论

发表评论

相关推荐

Javascript 测试框架之 隐式声明 之 describe

JavaScript之ECMAScript6新特性之_03_箭头函数（Arrow Function）

JavaScript之ECMAScript6新特性之_02_线程异步阻塞: Promise, Async / await

JavaScript之ECMAScript6新特性之_01_开篇

jQuery Versions - browser support

基于HTML5实现的中国象棋游戏

JavaScript之跨域请求解决方案

JavaScript之 25 道面试题

JavaScript小应用之分页算法

jQuery之empty() VS. remove()

jQuery之 prop() VS. attr()

jQuery之mouseover,mouseover,mouseout,mouseleave

javascript之JS操作iframe

javascript之面向对象编程之原型继承

HTML5之Cookie,localStorage 与 sessionStorage

jquery之live(), delegate(), on() 方法

javascript之小应用：网页在线聊天

javascript之编程序题目

javascript之面向对象编程之属性继承

javascript 之 undefined

最近访客更多访客>>

Javascript 测试框架之隐式声明之 describe