关于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);

            }

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

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

这里涉及到闭包问题，
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);