我无法让所有圆圈在 codehs javascript 变圈程序中改变颜色

Question

var NUM_CIRCLES = 15;
var MIN_RADIUS = 10;
var MAX_RADIUS = 40;
var DELAY = 500;
function start(){
    drawCircles();
    setTimer(update, DELAY);
}

function drawCircles(){
    for(var i = 0; i < NUM_CIRCLES; i++){
        circle = new Circle(Randomizer.nextInt(MIN_RADIUS, MAX_RADIUS));
        var x = Randomizer.nextInt(MIN_RADIUS, getWidth() - MAX_RADIUS);
        var y = Randomizer.nextInt(MIN_RADIUS, getHeight() - MAX_RADIUS);
        circle.setPosition(x, y);
        add(circle);
    }
}

function update(){
    var colors = Randomizer.nextColor();
    circle.setColor(colors);
}

编写一个程序，在屏幕上创建一个包含NUM_CIRCLES个圆的列表，这些圆的大小从MIN_RADIUS到MAX_RADIUS 。 每DELAY毫秒，获取一种随机颜色并将所有圆圈更改为这种颜色。 所有的圆圈在任何时候都应该有相同的颜色。

Answer 1

首先，您应该将 circle 声明为全局变量，因为您在多个函数中使用了 circle。 接下来你应该去掉 start function 中的 drawCircles function 并将其放入计时器中。 然后在你的 drawCircles function 中调用更新 function。

这是修改后的代码。

var NUM_CIRCLES = 15;
var MIN_RADIUS = 10;
var MAX_RADIUS = 40;
var DELAY = 500;
var circle;
function start(){
    setTimer(drawCircles, DELAY);
}

function drawCircles(){
    for(var i = 0; i < NUM_CIRCLES; i++){
        circle = new Circle(Randomizer.nextInt(MIN_RADIUS, MAX_RADIUS));
        var x = Randomizer.nextInt(MIN_RADIUS, getWidth() - MAX_RADIUS);
        var y = Randomizer.nextInt(MIN_RADIUS, getHeight() - MAX_RADIUS);
        update();
        circle.setPosition(x, y);
        add(circle);
    }
}

function update(){
    var colors = Randomizer.nextColor();
    circle.setColor(colors);
}

Answer 2

 setTimer(update, DELAY);

在这里，当您调用更新函数时，更新后没有 () 将其更改为：

 setTimer(update(), DELAY);