Javascript Question...

[Rayj]

I am using PIXI,  but I have a Javascript question.

 

Rather than doing somehing like this:  var card1 = new PIXI.Sprite.fromImage("images/cards_gif/h1.gif");  52 times (for a 52 card deck of cards),

how could I simplify this using a loop?  (I am only using 10 cards right now, but in total, there would be 52)

 

So right now I have the following:

 

var card1 = new PIXI.Sprite.fromImage("images/cards_gif/h1.gif");
  var card2 = new PIXI.Sprite.fromImage("images/cards_gif/h2.gif");
  var card3 = new PIXI.Sprite.fromImage("images/cards_gif/h3.gif");
  var card4 = new PIXI.Sprite.fromImage("images/cards_gif/h4.gif");
  var card5 = new PIXI.Sprite.fromImage("images/cards_gif/h5.gif");
  var card6 = new PIXI.Sprite.fromImage("images/cards_gif/h6.gif");  
  var card7 = new PIXI.Sprite.fromImage("images/cards_gif/h7.gif");
  var card8 = new PIXI.Sprite.fromImage("images/cards_gif/h8.gif");
  var card9 = new PIXI.Sprite.fromImage("images/cards_gif/h9.gif");
  var card10 = new PIXI.Sprite.fromImage("images/cards_gif/h10.gif");

 

How could I use a loop to reduce the lines of code? Something like: 

 

for(i=1; i < 11; i++){
   var card + i = new PIXI.Sprite.fromImage("images/cards_gif/h" + i + ".gif");}

 

This obviously doesn't work.  I need variables  card1 through card10 (through card 51 later).

 

Thanks,

Ray

 

 

 

[semk]

So what you can do is utilize the Object principle in JS:

 

var card = {};

 

for(i=1; i < 11; i++){
    card = new PIXI.Sprite.fromImage("images/cards_gif/h" + i + ".gif");}

 

 

Then you can call it out:

 

card.i

 

(where i = 1 thru 10)

 

Try to keep in mind that in JS an Array is an Object. 

[xerver]

Might want to just use an array:

var cards = [];for (var i = 0; i < 11; ++i) {    cards.push(new PIXI.Sprite.fromImage("images/cards_gif/h" + (i + 1) + ".gif"));}cards[2]; // == card3

[Rayj]

So what you can do is utilize the Object principle in JS:

 

var card = {};

 

for(i=1; i < 11; i++){

    card = new PIXI.Sprite.fromImage("images/cards_gif/h" + i + ".gif");}

 

 

Then you can call it out:

 

card.i

 

(where i = 1 thru 10)

 

Try to keep in mind that in JS an Array is an Object. 

So I have this code:

 

var card = {};

for(i=1; i < 11; i++){

card = new PIXI.Sprite.fromImage("images/cards_gif/h" + i + ".gif");}

//Add the table and cards to the stage

table.x = 300;

table.y = 300;

stage.addChild(table);

stage.addChild(card.1);

card.2 = 72;

card.2 = 0;

stage.addChild(card.2);

 

But I'm getting this error:  SyntaxError: missing ) after argument list at stage.addChild(card.1); 

 

Ideas?

 

Ray

[semk]

So I have this code:

 

var card = {};

for(i=1; i < 11; i++){

card = new PIXI.Sprite.fromImage("images/cards_gif/h" + i + ".gif");}

//Add the table and cards to the stage

table.x = 300;

table.y = 300;

stage.addChild(table);

stage.addChild(card.1);

card.2 = 72;

card.2 = 0;

stage.addChild(card.2);

 

But I'm getting this error:  SyntaxError: missing ) after argument list at stage.addChild(card.1); 

 

Ideas?

 

Ray

 

Sorry, JS doesn't like var or properties that start with integers. 

 

Try this:

 

for(i=1; i < 11; i++){

card['a'+i] = new PIXI.Sprite.fromImage("images/cards_gif/h" + i + ".gif");}

 

then call it out card.a1, card.a2, etc.. 

 

Also play around with Xerver's suggestion, arrays and objects are almost interchangeable in JS, but one might provide a better data structure than the other depending on what you're doing.

[xerver]

Properties can start with numbers, thats fine. Technically as an object strings are the only thing allowed as keys, and Number is just coerced into a string when made a key.

 

What you can't do is use dot notation with a numeric key. Just use bracket notation:

//invalidcards.1//validcards[1]

Like I mentioned though, sounds like you want an array...