Create a dynamic variable reference in Typescript

Question

Thanks ahead of time, to anyone who helps. :)

This may seem a simple answer to those who are experienced, but I have scoured the internet as well as a couple of reference books, and not found a straight forward answer to this question, so hopefully it may be of help to others as well.

I'm currently transitioning from Actionscript to Typescript, and have a reasonable amount of experience with vanilla Javascript, so to put it simply in Javascript terms, if I wanted to dynamically reference a variable, I could simply use something like this:

var myTextA = "Hello!";
var myTextB = "Goodbye!";
var textList = ["A", "B"];
console.log("I want to say " + this["myText" + textList[0]]);

The result would of course be: "I want to say Hello!"

In Typescript this does not appear to be possible with private variables in a class, and results in the following TSC error:

"Index signature of object type implicitly has an 'any' type."

As far as I can gather, typescript expects me to declare the variable type in some way, within the dynamic construct, however I cannot find any clear reference on how to do this.

For my own purposes, to put this in context, I am working on a project where I need to loop through a series of paired variables that all have the same beginning, but slightly different endings so simply putting the variables themselves in an array is not an option (Or would be a messy solution, at any rate).

For example:

var myVar1a, myVar1b, myVar2a, myVar2b etc...

So in the loop, I would want to refer to both a and b of each:

console.log(this["myVar" + (i+1) + "a");
console.log(this["myVar" + (i+1) + "b");

Any help is much appreciated!!

Tense

Did you 'inherit' these variable names? Because otherwise a different setup of your variables could lead to another (better?) solution. – Sclerometer

Hi Simon, yes, unfortunately. That's the situation I've got to work with, and I was simply trying to find a neat way of accessing them. :) – Tense

Answer 1

I would suggest to go with object oriented 'typed' approach. After all this is why you probably want to use typescript and not javascript. So in typescript you would do this in the following manner. To give meaning to 'this' you must refer to it inside some class. It your case it could look like this:

class Test
{
    private myTextA = "Hello!";
    private myTextB = "Goodbye!";
    private textList = ["A", "B"];

    public callMe()
    {
        console.log("I want to say " + this["myText" + this.textList[0]]);
    }
}

console.log((new Test()).callMe());

Niel

Thanks Amid. I am using the typed approach (coming mostly from an Actionscript background), but used the Javascript example as it's pretty much the same as how I would do it in Actionscript (just without the typing). Trying to access private variables within a class in Typescript using the method you've shown, is what appears to result in the TSC error. – Tense

I have updated sample with private properties. Note though that in order to be able to call 'Test.CallMe' method from outside it must still be defined as public – Niel

I ended up back-engineering and going the array route, as I would have done normally. However, it's been very helpful to see the examples, and it's getting me all the more used to Typescript. Thanks very much! – Tense

Answer 2

As far as I can gather, typescript expects me to declare the variable type in some way, within the dynamic construct, however I cannot find any clear reference on how to do this.

You need to specify an index signature. E.g.:

// Here you are saying that map is something that when accessed by a string returns a string
var map: {[key:string]:string} = {};  


map['myTextA'] = "Hello!";
map['myTextB'] = "Goodbye!";
var textList = ["A", "B"];
console.log("I want to say " + map["myText" + textList[0]]);

Brumby