Question

I am using the following code to try out the canvas element

    Shape = function(x,y){
        this.x = x;
        this.y = y; 
    };

    shapes = new array();

    shapes.push(new Shape(50,50,10,10));
    shapes.push(new Shape(100,100,10,10));
    shapes.push(new Shape(150,150,10,10));

    function animate(){
        context.clearRect(0,0, canvas.width(),canvas.height());
        var shapesLength = shapes.length;
        for(var i = 0; i < shapesLength; i++){
            var tmpShape = shapes[i];
            tmpShape.x++;
            context.fillRect(tmpShape.x,thmpShape.y,10,10);
        }
        context.fillStyle = 'yellow';
        context.fill();
        if(playAnimation){
            setTimeout(animate, 1)
        }
    }

However, when I run this in the browser I get the following error –

ReferenceError: array is not defined    

shapes = new array();

I have tried making it a global and local variable I just cant see where I am going wrong?

Answer 1

array should be capitalized, as that is the name of the constructor:

shapes = new Array();

In addition it’s better to use the square bracket notation to create an array. Like this:

shapes = [];