JavaScript create objects in for-loop

Question

I'm making a canvas game in JavaScript and have some trouble saving the data. I'm placing images on the canvas with a for-loop and I want to save information for each image in objects. For each image an object.

function CreateBlocks(){
    for(var i = 0; i <= blocks; i++){
        var img   = new Image();
        img.src   = "/images/Block.png";

        blockObject = {
            x:    x, 
            y:    y, 
            points:  10
         }
         ctx.drawImage(img,x,y);

         x += 100;
         y += 100;
    }
}

Now this obviously overwrites the blockObject everytime it loops. I tried adding to loop value to the name of the object like block[i]Object or blockObject[i] but that returns syntax errors.

I could just create a single dimension array for each value, but that seems rather messy to me. How can I create the objects in the loop?

Amir Popovich · Accepted Answer · 2015-06-30 07:43:34Z

6

Simply use an array and push the new object each time:

function CreateBlocks(){
    var arr = [];

    for(var i = 0; i <= blocks; i++){
        var img   = new Image();
        img.src   = "/images/Block.png";

        arr.push({
            x:    x, 
            y:    y, 
            points:  10
         });

         ctx.drawImage(img,x,y);

         x += 100;
         y += 100;
    }
}

answered Jun 30, 2015 at 7:43

Amir Popovich

30.1k9 gold badges58 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

doldt · Accepted Answer · 2015-06-30 08:04:23Z

0

If you create a blockObjects array, your second idea, using the blockObject[i] syntax will work:

var blockObjects=[];

function CreateBlocks(){
    for(var i = 0; i <= blocks; i++){
        var img   = new Image();
        img.src   = "/images/Block.png";

        blockObjects[i] = {
            x:    x, 
            y:    y, 
            points:  10
        };
        ctx.drawImage(img,x,y);

        x += 100;
        y += 100;
    }
}

edited Jun 30, 2015 at 8:04

answered Jun 30, 2015 at 7:43

doldt

4,5063 gold badges24 silver badges36 bronze badges

Collectives™ on Stack Overflow

JavaScript create objects in for-loop

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related