Рисование массива шаров не работает

Question

Я хочу иметь возможность рисовать массив шариков, я могу вставлять шарики в массив (при нажатии на холст).

Я могу нарисовать 1 шарик на холсте, если я его создаюс ball = new Ball, но как только я пытаюсь нарисовать изнутри массива, он разрывается.

Я рисую внутри цикла for с balls[i].draw

Вот jsFiddle.

А вот соответствующий код:

function init(){
defaultBall();
    for(i=0;i<balls.length;i++){
        balls[i].draw;
    }
    ball.draw();
}

function Ball(X, Y, Radius, Color){
    this.X = X || 0;
    this.Y = Y || 0;
    this.radius = 5;
    this.color = Color;
}
Ball.prototype.draw = function(){
    ctx.fillStyle = this.color;
    ctx.beginPath();
    ctx.arc(this.X, this.Y, this.radius, 10, 0, Math.PI*2, true);
    ctx.closePath();
    ctx.fill();
}

var balls = [];

function defaultBall(){
    addBall(new Ball(50, 50, 5, '#6B7E00'));
    addBall(new Ball(150, 50, 5, '#6B7E00'));
}

function addBall(ball){
    balls.push(ball);
}
var ball = new Ball(50, 50, 5, '#6B7E00');

Как мне сформулировать цикл, чтобы можно было рисовать шарики?

Справка оценена.

Answer 1

Может

balls[i].draw;

должно быть

balls[i].draw();

в строке 4

Answer 2

Ваш код работает нормально, просто в вашей петле шаров есть небольшая ошибка.

defaultBall();
for(i=0;i<balls.length;i++){
    balls[i].draw;
}
ball.draw();

Вы забыли использовать круглые скобки для вызова метода draw при циклическом прохождении мячей. Исправить это просто:

defaultBall();
for(i=0;i<balls.length;i++){
    balls[i].draw();
}
ball.draw();

Обратите внимание, что теперь ваши шары будут отображаться как задумано. Когда скрипка отредактирована с помощью этого нового исправления для циклического перемещения по шарикам, вы можете увидеть два зеленых шарика.

Answer 3

Ваш метод инициализации больше не вызывается. Если вы измените

function addBall(ball){
    balls.push(ball);
    ball.draw();
}

до

function addBall(ball){
    balls.push(ball);
}

вы увидите новые шары. У вас должен быть какой-то механизм, который снова вызывает init (он же draw).

И, как указал Фритс, вам нужно будет использовать draw () вместо draw.