Javascript setTimeout函数的不稳定行为

在这里，不是逐个执行，而是只针对最后一个值执行此代码。也就是说，对于1到xObj.length-1坐标，它进入循环函数内部，进入循环函数外部，并且不执行循环代码。但是，对于最后一个坐标，它完美地执行了代码。我不明白为什么

xObj和y Obj是阵列的形式为[1,2,3,4…]，包含要绘制的坐标

我试图得到输出，这样，点被一个接一个地画出来，然后消失。。i、 e.一个点被绘制，然后淡出，然后另一个点被绘制，然后淡出

这是我的代码：

for (i = 0; i < xObj.length; i++) {
    console.log("for loop running " + i);
    x = xObj[i];
    y = yObj[i];
    var centerX = x
    var centerY = y
    var radius = 10;

    var alpha = 1, /// current alpha value
        delta = 0.002; /// delta = speed
    flag = 0;
    loop();

    function loop() {

        console.log("inside loop" + centerX + centerY);
        alpha -= delta;
        if (alpha <= 0) {
            console.log("heya_amigoes");
            flag = 1;
            return;
        }
        console.log("hi1");
        /// clear canvas, set alpha and re-draw image
        ctx2.clearRect(0, 0, 1000, 600);
        ctx2.globalAlpha = alpha;
        ctx2.beginPath();
        ctx2.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
        ctx2.fillStyle = "#FF0000";
        ctx2.fill();
        ctx2.lineWidth = 1;
        ctx2.strokeStyle = '#003300';
        ctx2.stroke();

        console.log("hi2");
        //requestAnimationFrame(loop); // or use setTimeout(loop, 16) in older browsers
        setTimeout(loop, 16)
        console.log("hi3");
    }

    console.log("outside loop func");

}

对于最后一个坐标：

inside loop10357
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3
hello.php:129 inside loop10357
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3
hello.php:129 inside loop10357
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3
hello.php:129 inside loop10357
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3

最后这张照片终于印出来了不知道为什么

inside loop10357
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes

---

因为一旦for循环完成，例如，

centerX

，将是所有“循环”实例的centerX的最后一个值。。。您需要为（i=0；i

if（xObj.length！==i）setTimeout（'loop'，16）

我会在

循环

函数上有一个参数，而不是在循环中定义它。超级邋遢。@JaromandaX回路电流？但是循环是一个函数。。我应该把所有的东西都放在函数（i）中吗？

for（i=0；i

-这是你当前的for循环-介于

for（i=0；i

和最后的

}

之间的任何东西都是你当前for循环的主体-我没有使用“函数”这个词当引用循环时，因为一旦for循环完成，

centerX

将是所有“循环”实例的centerX的最后一个值……您需要一个最简单的解决方案-

for（i=0；i

如果（xObj.length！==i）setTimeout（'loop'，16）；

我会在

循环

函数上有一个参数，而不是在循环中定义它。超级邋遢。@JaromandaX current for loop？但是循环是一个函数..我应该把所有的东西都放在函数（i）中吗？

for（i=0；i

-这是当前for循环-介于

for（i=0；i

和最后一个

}

之间的任何内容都是当前for循环的主体-我在引用循环时没有使用“函数”一词

inside loop10357
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes
hello.php:129 inside loop10357
hello.php:133 heya_amigoes