Javascript use variable as object name

Javascript

Javascript Problem Overview


I want to use the value of a variable to access an object.

Let's say I have an object named myobject.

I want to fill a variable with this name and use the variable to access the object.

Example:

var objname = 'myobject';
{objname}.value = 'value';

Javascript Solutions


Solution 1 - Javascript

Global:

myObject = { value: 0 };
anObjectName = "myObject";
this[anObjectName].value++;

console.log(this[anObjectName]);

Global: v2

var anObjectName = "myObject";
this[anObjectName] = "myvalue"

console.log(myObject)

Local: v1

(function() {
    var scope = this;
    
    if (scope != arguments.callee) {
        arguments.callee.call(arguments.callee);
        return false;
    }

    scope.myObject = { value: 0 };
    scope.anObjectName = "myObject";
    scope[scope.anObjectName].value++;

    console.log(scope.myObject.value);
})();

Local: v2

(function() {  
    var scope = this;
    
    scope.myObject = { value: 0 };
    scope.anObjectName = "myObject";
    scope[scope.anObjectName].value++;

    console.log(scope.myObject.value);    
}).call({});

Solution 2 - Javascript

Use square bracket around variable name.

var objname = 'myobject';
{[objname]}.value = 'value';

Solution 3 - Javascript

Is it a global variable? If so, these are actually part of the window object, so you can do window[objname].value.

If it's local to a function, I don't think there's a good way to do what you want.

Solution 4 - Javascript

The object exists in some scope, so you can almost always access the variable via this syntax:

var objname = "myobject";
containing_scope_reference[objname].some_property = 'some value';

The only place where this gets tricky is when you are in a closed scope and you want access to a top-level local variable. When you have something like this:

(function(){
    var some_variable = {value: 25};
    var x = "some_variable";
    console.log(this[x], window[x]); // Doesn't work
})();

You can get around that by using eval instead to access the current scope chain ... but I don't recommend it unless you've done a lot of testing and you know that that's the best way to go about things.

(function(){
    var some_variable = {value: 25};
    var x = "some_variable";
    eval(x).value = 42;
    console.log(some_variable); // Works
})();

Your best bet is to have a reference to a name in an always-going-to-be-there object (like this in the global scope or a private top-level variable in a local scope) and put everything else in there.

Thus:

var my_outer_variable = {};
var outer_pointer = 'my_outer_variable';
// Reach my_outer_variable with this[outer_pointer]
// or window[outer_pointer]

(function(){
    var my_inner_scope = {'my_inner_variable': {} };
    var inner_pointer = 'my_inner_variable';
    // Reach my_inner_variable by using
    // my_inner_scope[inner_pointer]
})();

Solution 5 - Javascript

You could use eval:

eval(variablename + ".value = 'value'");

Solution 6 - Javascript

You can't do this in general, except at the window scope, where you can write window[objname].value = 'value';

Solution 7 - Javascript

I think Shaz's answer for local variables is hard to understand, though it works for non-recursive functions. Here's another way that I think it's clearer (but it's still his idea, exact same behavior). It's also not accessing the local variables dynamically, just the property of the local variable.

Essentially, it's using a global variable (attached to the function object)

// Here's  a version of it that is more straight forward.
function doIt() {
    doIt.objname = {};
    var someObject = "objname";
    doIt[someObject].value = "value";    
    console.log(doIt.objname);
})();

Which is essentially the same thing as creating a global to store the variable, so you can access it as a property. Creating a global to do this is such a hack.

Here's a cleaner hack that doesn't create global variables, it uses a local variable instead.

function doIt() {
  var scope = {
     MyProp: "Hello"
  };
  var name = "MyProp";
  console.log(scope[name]);
}

See https://stackoverflow.com/questions/10953303/javascript-interpret-string-as-object-reference/10953396#10953396

Solution 8 - Javascript

let players = [];
players[something] = {};
players[something].somethingElse = 'test';
console.log(players); 

-> [ something: { somethingElse: 'test' } ];

Solution 9 - Javascript

It can be as simple as this

var myObjKey = "key";

var obj = {[myObjKey] : "value" };
console.log(obj); // => {key: 'value'}

Solution 10 - Javascript

If object is in some namespace ie. Company.Module.Components.Foo you can use this function:

CoffeeScript:

objByName: (name, context = window) ->
	ns = name.split "."
	func = context
	for n, i in ns
		func = func[n]
	return func

Resulted Js:

objByName: function(name, context) {
  var func, i, n, ns, _i, _len;
  if (context == null) {
    context = window;
  }
  ns = name.split(".");
  func = context;
  for (i = _i = 0, _len = ns.length; _i < _len; i = ++_i) {
    n = ns[i];
    func = func[n];
  }
  return func;
}

Then you can create a new object or do whatever. Note the parenthises through.

var o = new (objByName('Company.Module.Components.Foo'))
objByName('some.deeply.nested.object').value

This idea is borrowed from similar question: https://stackoverflow.com/questions/359788/how-to-execute-a-javascript-function-when-i-have-its-name-as-a-string

Solution 11 - Javascript

One of the challenges I had with the answers is that it assumed that the object was a single level. For example,

const testObj = { testKey: 'testValue' }
const refString = 'testKey';
const refObj = testObj[refString];

works fine, but

const testObj = { testKey:
                  { level2Key: 'level2Value' }
                }
const refString = 'testKey.level2Key';
const refObj = testObj[refString];

does not work.

What I ended up doing was building a function to access multi-level objects:

objVar(str) {
    let obj = this;
    const parts = str.split('.');
    for (let p of parts) {
        obj = obj[p];
    }
    return obj;
}

In the second scenario, then, I can pass the string to this function to get back the object I'm looking for:

const testObj = { testKey:
                  { level2Key: 'level2Value' }
                }
const refString = 'testObj.testKey.level2Key';
const refObj = objVar[refString];

Solution 12 - Javascript

You can set an objects property this way:

var obj = {};
obj.whateverVarName = 'yourVal';
console.log(obj);

Solution 13 - Javascript

If you already know the list of the possible varible names then try creating a new Object(iconObj) whose properties name are same as object names, Here in below example, iconLib variable will hold two string values , either 'ZondIcons' or 'MaterialIcons'. propertyName is the property of ZondIcons or MaterialsIcon object.

   const iconObj = {
    ZondIcons,
    MaterialIcons,
  }
  const objValue = iconObj[iconLib][propertyName]

Solution 14 - Javascript

When using the window[objname], please make sure the objname is global variables. Otherwise, will work sometime, and fail sometimes. window[objname].value.

Solution 15 - Javascript

var micro=[{'test':'hello'}];

var device = 'test';

console.log(micro[device]);

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionPeeHaaView Question on Stackoverflow
Solution 1 - JavascriptShazView Answer on Stackoverflow
Solution 2 - JavascriptVaishali VenkatesanView Answer on Stackoverflow
Solution 3 - JavascriptJW.View Answer on Stackoverflow
Solution 4 - JavascriptSean VieiraView Answer on Stackoverflow
Solution 5 - JavascriptMidasView Answer on Stackoverflow
Solution 6 - JavascriptNeilView Answer on Stackoverflow
Solution 7 - JavascriptJuan MendesView Answer on Stackoverflow
Solution 8 - Javascriptuser11968920View Answer on Stackoverflow
Solution 9 - JavascriptUzair AliView Answer on Stackoverflow
Solution 10 - Javascriptuser133408View Answer on Stackoverflow
Solution 11 - JavascriptMitch ParkerView Answer on Stackoverflow
Solution 12 - JavascriptThisisFishView Answer on Stackoverflow
Solution 13 - JavascriptSumerView Answer on Stackoverflow
Solution 14 - Javascriptlyon819View Answer on Stackoverflow
Solution 15 - JavascriptalfonsoolavarriaView Answer on Stackoverflow