HTML5 Canvas JS: Store Path to Dynamic text as Variable?

[Jeffery.Wright]

Writing this out every time for the numerous click functions I have seems a bit redundant:

exportRoot.TXT_add.text = "Some Value";
exportRoot.TXT_ext.text = "Another Value";

This would be tidier:

ADDR = "Some Value";
EXT = "Another Value";

There must be some way to do this, but I can't find anything on the topic.
This is my attempt:

var ADDR = exportRoot.TXT_add.text;
var EXT = exportRoot.TXT_ext.text;

clear_INFO=function(){
ADDR = " ";
EXT = " ";
	}

clear_INFO();

That should clear the content of the Dynamic text objects, but it does nothing. And it also does not produce a console error, shouldn't it?

Is this sort of thing simply not possible? Looking for clues, thanks. 

[kglad]

it's not clear what you're trying to do unless you have more than 2 textfields.  do you?

[Jeffery.Wright]

Any number of text fields, is there a way to store the path to them in a variable?

There are two in my example, thanks. 

[kglad]

you can use bracket notation to coerce strings to objects.

var s = "add"

exportRoot[TXT_ + s].text = whatever;

this is typically used with arrays (or more perceptive object names) and for-loops.

[Jeffery.Wright]

Thanks for that, I never would have guessed that solution... very interesting.

[JoãoCésar · Accepted solution]

Hi.

The .text is a property of a text field and not the text field itself. So when you store a reference to it you only storing a reference to a primitve value.

What you can do is to store references to the text fields themselves like this:

var addTF = exportRoot.TXT_add;
var extTF = exportRoot.TXT_ext;

Them set their texts properties like this:

addTF.text = "";
extTF.text = "";

Regards,

JC

[Jeffery.Wright]

Thanks man, at least I was close... I wonder why the variable can't store .text  as part of the complete path to the object? 

To me, intuitively, I would think the variable 

ADDR = exportRoot.TXT_add.text;

would mean, that ADDR would be the same value as exportRoot.TXT_add.text and equating it with a string, would be exactly like 

exportRoot.TXT_add.text = "Some Value";

Variables then cannot refer to the property of the object at the end of its path? That sure would be useful. 

Thanks again!

[kglad]

the text property to a textfield isn't different from the x property of an object.  ie, if you store the x property, you're storing nothing about the object.

if you want to store a reference to the object, do exactly that and do not store a property of the object (unless that's you want to access, the property).

[JoãoCésar]

This is due to how variables are stored in memory.

Primitive data types like strings are copied to new memory addresses, whereas types like objects are stored by reference.

For example:

var a = 10;
var b = a;

console.log(a); // 10
console.log(b); // 10

a += 2;

console.log(a); // 12
console.log(b); // 10

You can see in this example that the value of b stays the same. This is because initially b stored only a copy of the value of a but, in poor words, it doesn't keep track of what is going on with a.

Another example:

var obj1 = { someProp: 10 };
var obj2 = obj1;

console.log(obj1.someProp); // 10
console.log(obj2.someProp); // 10

obj1.someProp += 2;

console.log(obj1.someProp); // 12
console.log(obj2.someProp); // 12

You can see in this example that the value of obj2.someProp also changed because obj2 stored a reference in memory to obj1. Meaning that boths objects point to the same address in memory.

Another one:

var c = 20;

function increase(value)
{
    value++;
}

increase(c);
console.log(c); // 20

You can see that the value of c didn't change because the increase function only copied that value of c to another memory address thus what was actually increased was the value variable and not c.

Here is a video explaining this in more details:

https://www.youtube.com/watch?v=fD0t_DKREbE

I hope this helps.

Regards,

JC