小羊也疯狂
2017-04-22 09:06
采纳率: 88.4%
浏览 998
已采纳

关于settimeout和循环一起使用出了个问题

图片说明
图中 canvas有动画效果
但是最开始我把106行写到104行是没有动画效果的
这么什么原因造成的? 是不是类似js循环i取最大的那个原因。
在第一次延迟以后执行的函数是

 function () {

                ctx.clearRect(0,0,2*r,2*r);
                draw(time);
//此时time已经是1了
            }     

而不是执行 延迟前具体化time值的函数(表述有点问题....)

 function () {

                ctx.clearRect(0,0,2*r,2*r);
                draw(0.001);

            }
  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • 已采纳

    因为计时器是延时执行的,执行完for语句你的第一个计时器还没执行,所以执行第一个计时器时time已经是执行过1k次后的值10了,后续的引用同一个time当然都是10了

    放里面的话由于你的delay不一样,所以每次执行时time会每次+0.01

    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • miaoch 2017-04-24 09:16

    这里涉及到闭包问题,
    setTimeout()里面的匿名函数是一个闭包,他的time指向的是'onload',后面的那个匿名函数中的time。
    所以你把time写在闭包外面的话,最终time都是执行一千次循环后最终的time。
    而如果你写在闭包里面的话,虽然在闭包内部time是对了,但是又不符合你的延时时间的要求。所以我觉得从104行到110行可以改成:
    time = time+0.001;
    setTimeout((function(time){
    return function(){
    ctx.clearRect(0,0,2*r,2*r);
    draw(time);
    }
    })(time), 500+time * 200);

    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题