Question

此处代码不是逐个执行，而是仅针对最后一个值执行。这是针对1到xObj.length-1坐标，它进入循环函数并进入循环函数之外，它不执行循环代码。但是，对于最后的坐标，它完美地执行代码。我无法弄清楚为什么？

xObj和y Obj是 [1,2,3,4 ...] 形式的数组，包含要绘制的坐标。

我正在尝试获取输出，以便逐点绘制点并逐渐消失..即，一个点被绘制然后它淡出然后另一个点被绘制然后它淡出。

这是我的代码：

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");

}

最初为其余坐标打印的控制台的示例，除了最后一个。

for loop running 0
hello.php:129 inside loop10393
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3
hello.php:155 outside loop func
hello.php:105 for loop running 1
hello.php:129 inside loop52410
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3
hello.php:155 outside loop func
hello.php:105 for loop running 2
hello.php:129 inside loop394525
hello.php:137 hi1
hello.php:149 hi2
hello.php:152 hi3
hello.php:155 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

setTimeout函数的不稳定行为

0 个答案: