Default value for object

Question

I am using the Canvas 2d context to write text to the screen..

To accomplish this I have it run through an array of text objects that I created, right now I have the text objects with 3 properties:

text.text
text.x
text.y

text.text holds the string to write, text.x holds the value for the x position, and text.y holds the value for the y position

Is there anyway I could skip the text.text property?

so for example, right now it looks something like this:

var textStrings = [];

textStrings[0] = {};
textStrings[0].text = "hello";
textStrings[0].x = 0;
textStrings[0].y = 10;

textStrings[1] = {};
textStrings[1].text = "world";
textStrings[1].x = 10;
textStrings[1].y = 10;

But is there any way that I could do something like this instead:

textStrings = [];
textStrings[0] = {};
textStrings[0] = "hello";
textStrings[0].x = "0";
textStrings[0].y = 10;

textStrings[1] = {};
textStrings[1] = "world";
textStrings[1].x = 10;
textStrings[1].y = 10;

basically a default property of an object or something...

right now as soon as I do something like

textStrings[0] = "hello";

it changes textStrings to a string instead of an object, and then I can no longer add properties to it, since its a primitive data type.

Thanks

Answer 1

You can use String objects instead of primitive values:

var a = new String("hello");
a.x = "0";
a.y = 10;
var b = new String("world");
b.x = "10";
b.y = 10;

var textStrings = [a, b];

You might also use special objects. The toString method is automatically used when the object is to be converted to a string:

function Text(t, x, y) {
    this.text = t; this.x = x; this.y = y;
}
Text.prototype.toString = function() { return this.text; }
alert(new Text("hello", 0, 0)); // implicit string conversion
console.log(""+new Text("world", 10, 10)); // explicit string conversion

I guess you would have such a constructor function anyway, to simplify the syntax for the textStrings array.

Answer 2

If your text strings are guaranteed to be unique, you could use them for indexing:

var textStrings = {};
textStrings["world"].x = 10;
textStrings["world"].y = 10;

and then you could get a list of your "text" strings (so that you can index through your object) using the following snippet:

textkeys : function  (textStrings) {
   var accumulator = [];
   for (var propertyName in o) {
      arr.push(propertyName);
   }
   return accumulator;
}

from snipplr

Answer 3

Similar to the idea of @Bergi, but using a functional approach for creating the objects:

var textCreator = function (text, x, y) {
    var that = {};

    that.text = text;
    that.x = x;
    that.y = y;

    that.toString = function () {
        return text;
    }

    return that;
};

textStrings = [];
textStrings[0] = textCreator("hello", 0 ,10);

textStrings[1] = textCreator("world", 10, 10);

And just for completeness: you could extend the String prototype, but that is not advisable, and is practically the same as one of the solutions provided by Bergi.

String.prototype.x = null;
String.prototype.y = null;

textStrings = [];
//textStrings[0] = "hello";
textStrings[0] = new String("hello");
textStrings[0].x = "0";
textStrings[0].y = 10;

//textStrings[1] = "world";
textStrings[1] = new String("world");
textStrings[1].x = 10;
textStrings[1].y = 10;