javascript setTimeout的深度递归设置完成后回调

http://www.111cn.net/wy/js-ajax/44183.htm

 

setTimeout  在执行时,是在载入后延迟指定时间后,去执行一次表达式,仅执行一次
setTimeout 在执行时,它从载入后,每隔指定的时间就执行一次表达式

1，基本用法：
   执行一段代码：

 代码如下 复制代码

   var i=0;
   setTimeout("i+=1;alert(i)",1000);
   执行一个函数：
   var i=0;
   setTimeout(function(){i+=1;alert(i);},1000);
  
   //注意比较上面的两种方法的不同。

   下面再来一个执行函数的：
   var i=0;
   function test(){
       i+=1;
       alert(i);
   }
   setTimeout("test()",1000);
   也可以这样：
   setTimeout(test,1000);

总结：
   setTimeout的原型是这样的：

 代码如下 复制代码

   iTimerID = window.setTimeout(vCode, iMilliSeconds [, sLanguage])
  
  setTimeout有两种形式

  setTimeout(code,interval)
  setTimeout(func,interval,args)

  其中code是一个字符串
  func是一个函数.

  注意"函数"的意义,是一个表达式,而不是一个语句.
  比如你想周期性执行一个函数

 代码如下 复制代码
  function a(){
      //...
  }
  可写为
  setTimeout("a()",1000)
  或
  setTimeout(a,1000)

  这里注意第二种形式中,是a,不要写成a(),切记!!!


Javascript中给一个使用了setTimeout的深度递归设置完成后回调


问题：

因为递归太深而使用了异步的 setTimeout 清空调用栈，整个递归变成了异步的行为，函数已经提前返回了，现在怎么设置整个递归完成后的回调？

回答：

看了问题评论才理解你的意思，我按照你的目的写了一个能调试的代码，你看看跟你问题中的代码是不是差不多：

 

 

 代码如下 复制代码

// 无回调
 function isArray(o) {
     return toString.apply(o) === '[object Array]';
 }
 function foo(arr) {
     console.log(arr);
     if (isArray(arr)) {
         for (i in arr) {
             (function(j) {
             setTimeout(function() {
                 foo(arr[j]);
             }, 0);
             })(i);
         }
     }
 }
 foo([[1, 2], [3, 4]]);
 
 /*
 输出：
 [[1,2],[3,4]]
 [1,2]
 [3,4]
 1
 2
 3
 4
 */
 
 //有回调
 function isArray(o) {
     return toString.apply(o) === '[object Array]';
 }
 // 设置一个计数器，标识“已知的还未被遍历的元素数量”，起始值显然为1
 var cbCounter = 1;
 function foo(arr, cb) {
     cbCounter += isArray(arr) ? arr.length : 0; // 把子元素的数加上，因为子元素现在已知了
      console.log(arr);
     if (isArray(arr)) {
         for (i in arr) {
             (function(j) {
             setTimeout(function() {
                 foo(arr[j], cb);
             }, 0);
             })(i);
         }
     }
     if ((--cbCounter === 0) && (typeof cb === 'function')) cb(); // 前面的--就是把自己刨出去
 }
 foo([[1, 2], [3, 4]], function() {
      console.log('I am a callback!');
 });
 
 /*
 输出：
 [[1,2],[3,4]]
 [1,2]
 [3,4]
 1
 2
 3
 4
 I am a callback!
 */

 

 

 

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

x=document.getElementById("demo");
x.innerHTML="浏览器的内部窗口宽度：" + w + "，高度：" + h + "。"

 
function myFunction()
{
       function action(number)
       {
           setTimeout(function(){console.log(number)},number*1000);
       }
      
       for(var i=0;i<3;i++){      
          //console.log(i);
          //action(i);
         function action(i)
       {
           setTimeout(function(){console.log(i)},i*1000);
       }
       }
}

//myFunction();


 function isArray(o) {
     return toString.apply(o) === '[object Array]';
 }
 // 设置一个计数器，标识“已知的还未被遍历的元素数量”，起始值显然为1
 var cbCounter = 1;
 function foo(arr, cb) {
     cbCounter += isArray(arr) ? arr.length : 0; // 把子元素的数加上，因为子元素现在已知了
      console.log(arr);
      console.log(cbCounter);
 //console.log(j);
     if (isArray(arr)) {
         for (i in arr) {
             (
             function(j) {
 //console.log(j);
             setTimeout(function() {
                 foo(arr[j], cb);
             }, 0);
             })(i);
         }
     }
     if ((--cbCounter === 0) && (typeof cb === 'function')) cb(); // 前面的--就是把自己刨出去
 }
 foo([[1, 2], [3, 4]], function() {
      console.log('I am a callback!');
 });

</script>

</body>
</html>

posted @ 2014-10-13 12:54  alxe_yu  阅读(335)  评论(0)    收藏  举报