为什么我的球（物体）没有收缩/消失？

http://jsfiddle.net/goldrunt/jGL84/42/ 这是来自JS小提琴的第84行。通过取消注释线141-146，可以将3种不同的效果应用于球。“弹跳”效果按其应有的方式起作用，但“ asplode”效果却不起作用。我应该在asplode函数中包括“缩小”函数吗？

// balls shrink and disappear if they touch
var shrink = function(p) {
    for (var i = 0; i < 100; i++) {
        p.radius -= 1;
    }
    function asplode(p) {
        setInterval(shrink(p),100);
        balls.splice(p, 1);
    }
}

您的代码有一些问题。

首先，在您的定义中：

var shrink = function(p) {
    for (var i = 0; i < 100; i++) {
        p.radius -= 1;
    }

    function asplode(p) {
         setInterval(shrink(p),100);
        balls.splice(p, 1);
    }
}

asplode是内部作用域的本地对象shrink，因此update在您试图调用它的地方代码不可访问。JavaScript范围是基于函数的，因此update无法看到，asplode因为它不在内部shrink。（在控制台中，您会看到类似以下错误：Uncaught ReferenceError: asplode is not defined。）

您可以先尝试移至asplode之外shrink：

var shrink = function(p) {
    for (var i = 0; i < 100; i++) {
        p.radius -= 1;
    }
}

function asplode(p) {
     setInterval(shrink(p),100);
     balls.splice(p, 1);
}

但是，您的代码还有其他几个问题，不在此问题的范围内：

• setInterval期望功能。setInterval(shrink(p), 100)使setInterval得到的返回值的即时调用 shrink(p)。你可能想要

  setInterval(function() { shrink(p) }, 100)

• 您的代码for (var i = 0; i < 100; i++) { p.radius -= 1; }可能不执行您认为的操作。这将立即执行递减操作100次，然后直观地显示结果。如果要以每个新大小重新渲染球，则需要在单独的计时回调（如setInterval操作）中执行每个单独的递减操作。

• .splice需要数字索引，而不是对象。您可以使用以下命令获取对象的数字索引indexOf：

  balls.splice(balls.indexOf(p), 1);

• 到您的间隔第一次运行时，该balls.splice语句已经发生（准确地说，它发生在大约100毫秒之前）。我认为那不是您想要的。相反，您应该具有一个递减函数，该递减函数会被反复调用setInterval并最终在balls.splice(p,1)after之后执行p.radius == 0。

setInterval(shrink(p),100);

这并没有按照您的想法做。这将调用shrink，传递它p，然后将结果传递给setInterval。 shrink(p)返回undefined，因此该行实际上不会在间隔上放置任何内容。

您可能想要：

setInterval(function(){
    shrink(p)
}, 100);