2

I come from a C#/Java background and I'm trying to go about learning how to make games in HTML5. I ran across a problem that has been boggling my mind, and although normally I would ask a friend, he's been MIA. I feel bad having created an account to ask the community, but I've been searching for the answer to no avail.

So the problem is this... I want to create a gameobject that can hold an instance of a tower. Also, I want to create an array list of towers as a sort of back-end repository. Essentially, I was hoping these would be external js files that I would be able to reference in my main game. I'm not sure if this is possible in js or how this would work.

What I attempted to do was... Create an external JS file and declare a tower object. This is where I got lost. I wanted to make another object that was simply a list of the first type, a towerList. In this external JS file, I was going to populate the list with a bunch of tower properties. Then, in the main file with the canvas element, I was going to iterate through the list and draw out the graphics. I have no idea how to go about this.

function Tower (type, texture, cost, damage, speed, range, health, Xpos, Ypos) 
{
this.type = type;
this.texture = new Image();
this.texture.src = texture;
this.cost = 0;
this.damage = 0;
this.speed = 0;
this.range = 0;
this.health = 0;
this.Xposition = 0;
this.Yposition = 0;
this.target = false;
}


var TowerList = [Tower("Basic", "tower.png", 0, 0, 0, 0, 0, 0, 0), Tower(), Tower()];

I doubt I have this working correctly, but I want to be able to create instances of the towerlist in the main project, access it randomly like an array, and print its contents as I see fit. What's the best OO way to accomplish this in JS? I want to be able to later in the main code be able to assign a tower from the list as such

var tL = new TowerList();
var tower = new Tower();

tower = tL[0];

I just started this today, so I realize there's a lot of learning to be had. I think I need to redefine the function as a var else I can instantiate it (I'm sure I read that earlier). If anyone can help me out or point me in the direction to a resource that has examples that I might be able to learn from, I would very much appreciate it.

Improve this question

3 Answers 3

Reset to default
1

TowerList doesn't have to be a new type of object, just an Array will do:

var towerList = [];
towerList.push(new Tower("Basic", "tower.png", 0, 0, 0, 0, 0, 0, 0));
//             ^^^
//            use 'new' to instantiate a new Tower
towerList.push(...);

To iterate over TowerList:

var tower;

for (var i = 0, n = towerList.length; i < n; ++i) {
    tower = towerList[i];
    // do stuff with tower
}

You can make TowerList inherit from Array as well:

function TowerList()
{
}

TowerList.prototype = [];

TowerList.prototype.yourFunction = function() {
}

var towerList = new TowerList();

towerList.push(new Tower(...));

towerList.yourFunction();
Improve this answer
Sign up to request clarification or add additional context in comments.

7 Comments

he wants to be able to create instances of TowerList. That may just be a way of saying "having multiple arrays", but if taken literally then it means he wants a class/object type that he may eventually extend with more methods/properties.
@ben336 The List suffix has a meaning and Array comes closest to that.
fair enough. I basically suggested the same thing, just with a class wrapper around the array. If he doesn't intend to expand, your answer is definitely the right one. Upvoted
@ben336 If OP wishes to expand it, the more appropriate route might be to use [] as the object's prototype so you inherit all the Array goodness :)
I apologize for not clarifying my original question. I was intending to modify the tower class with methods unless there was a better options, engineering wise or other. I guess I should perhaps take the time to examine the project from an overhead standpoint.
|
0 
//your towers should be called using new here, assuming you actually 
//want a list of towers
var TowerList = [Tower("Basic", "tower.png", 0, 0, 0, 0, 0, 0, 0), Tower(), Tower()];
//TowerList needs to be a function to be called with new.  This will error out.
var tL = new TowerList();
//This should work correctly
var tower = new Tower();

//this would overwrite the new Tower() with tl[0]
tower = tL[0];

If you want to be able to create TowerList objects you probably want something like this

function TowerList(){
    this.list = [];

}


TowerList.prototype.addTower(tower){
  list.push(tower);

}


TowerList.prototype.getList(){
  return this.list;

}

Then you can just do this

var tL = new TowerList();
tL.addTower(new Tower("Basic", "tower.png", 0, 0, 0, 0, 0, 0, 0));
tL.addTower(new Tower());


var tower = tL[0];
Improve this answer

2 Comments

Thanks for offering your insights. You gave me some good ideas for code reminiscent of what I was used to.
No problem. If any of these answers were helpful you should upvote them, and if they solved your problem you should accept them. That's generally how people say thank you on this site :)
0

I would probably have tower return an object and then create instances of that. (avoiding "this")

Consider a modular approach: This helped me: http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html

Rough Idea:

function Tower(type, texture, cost, damage, speed, range, health, Xpos, Ypos)  {
    var obj = {};
        obj.type = type;
        obj.texture = new Image();
        obj.texture.src = texture;
        obj.cost = cost;
        obj.damage = 0;
        obj.speed = 0;
        obj.range = 0;
        obj.health = 0;
        obj.Xposition = 0;
        obj.Yposition = 0;
        obj.target = false;

    return obj;
}


var TowerList = [Tower("Basic", "r", 5, 0, 0, 0, 0, 0, 0), Tower(), Tower()];
var mytower = TowerList[1];
Improve this answer

1 Comment

I appreciate the link. I am reviewing the modular pattern to see how it would resolve my issue.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.