58

What I want to do is get the NAME of a variable passed to a function and the VALUE of that variable, and only have to pass in one variable to the function. So:

var x = "anything";

function showName() {

}

showName(x);

or

showName("x");

Which will return: "x = anything".

Right now, I have to specify the variable twice:

showName("x", x);

In order to get the name and value of the variable I am passing in.

Note that I am not interested in the name of argument in the prototype of showName, but the name of the variable in the calling function. Also, the variable passed may be local, so I can't use the window object to find the variable.

Eric Leschinski
  • 146,994
  • 96
  • 417
  • 335
  • http://stackoverflow.com/questions/1007981/how-to-get-function-parameter-names-values-dynamically-from-javascript and http://stackoverflow.com/questions/914968/inspect-the-names-values-of-arguments-in-the-definition-execution-of-a-javascript – Paolo Bergantino Jun 17 '09 at 22:56
  • 1
    If you pass a dictionary like this: `yourfunction({yourvariable});` then the insta-built dictionary contains key value pairs, the key is the name, and the value is the value of yourvariable. – Eric Leschinski Feb 06 '19 at 20:33

7 Answers7

73

The short answer is that you can't.

The longer, evil answer is that you sort of can with some real nastiness. And it only works when called from another function.

there are two interesting attributes available to you that could help

arguments.callee caller

for fn to do something like this:

(function(){
  var showMe = function(s){
    alert(arguments.callee.caller.toString().match(/showMe\((\S)\)/)[1] + 
    ' = '+ s)
  }
  x = 1
  showMe(x)
})()

What arguments.callee.caller.toString().match(..)[1] does is look for the showMe being called in the function calling it and prints it and its value.

But this is still pretty limited because it will only hit the first call of showMe(x). So if there is two calls to it, it won't work.

But, it was fun to play with these arcane things.

BaroqueBobcat
  • 10,090
  • 1
  • 31
  • 37
17

Strategy 1:

If you can control the data structure during function invocation then you can pass a dictionary which will encode name as a key, paired with its value, notice the stealth curly braces:

var foo = "bar";
yourfunction({foo});

Which passes a javascript dictionary that looks like this:

{foo : "bar"}

When yourfunction( is executed, unpack name and value thustly:

yourfunction = function(dict) { 
    var name = Object.keys(dict)[0];
    var value = dict[name];
    console.log(name);        //prints foo
    console.log(value);       //prints bar
}

Strategy 2:

If you can maintain an as-you-go list of name-value pairs in a global scope, then reflection and introspection is always available for set and get, for example: 

var my_global_stack = [];

yourfunction = function() { 

    //Chomp the stack
    var dict = my_global_stack.pop();

    //The name is the key at index 0
    var name = Object.keys(dict)[0];

    //Fetch the value by keyname:
    var value = dict[name];

    console.log(name);       //prints foo
    console.log(value);      //prints bar
}


foo = "bar";
my_global_stack.push({foo});
yourfunction();

Strategy 3:

If user-hostile input isn't an issue, you can use eval( to rediscover value given variablename, for example:

yourfunction = function(somevariable) { 
    console.log(somevariable);          //prints foo
    console.log(eval(somevariable));    //prints bar
}

foo = "bar";
yourfunction("foo");

People say eval( is evil here, because if a hostile user is able to overwrite the value of foo in memory at any point, then they can do OS Command Injection and run any command they want.
http://cwe.mitre.org/top25/#Guidance

Eric Leschinski
  • 146,994
  • 96
  • 417
  • 335
9
var x = "anything";

function showName(s) {
    alert(s + " = " + eval(s));
}

showName("x");

Not recommended, but there it is.

D'Arcy Rittich
  • 167,292
  • 40
  • 290
  • 283
  • 1
    What about x=1; showName(x) ? – BaroqueBobcat Jun 17 '09 at 23:05
  • @BaroqueBobcat - the above function works fine for me. If you are looking for edge cases, the function can easily be modified to stringify the data in different ways based on type or value. E.g., an empty array and empty string both display as empty. You may want to handle this differently, or add additional info about a best guess as to type. The point of the example is not to be bulletproof but to demonstrate that a function can obtain both parameter name and value from one scalar parameter. – D'Arcy Rittich Jun 18 '09 at 11:01
2

You could create a hash and pass that in:

var x = {a: 1,b:2}
function showVars(y) {
    for (var z in y) { alert(z + " is " + y[z]); }
}
showVars(x);

This doesn't necessarily show the name of the variable, but it does allow for key-value pairs, which may be more to the point of what you need.

DGM
  • 26,629
  • 7
  • 58
  • 79
2

This is what I use for debugging. No global variables, no eval, no arguments.callee or arguments.caller:

var Helpers = (function () {
    // ECMAScript 5 strict mode
    'use strict';

    var Module = {};

    Module.debug = function () {
        var i;

        for (i = 0; i < arguments.length; i++) {
            console.log(arguments[i] + ':', this[arguments[i]]);
        }
    };

    Module.SomeObject = function SomeObject() {
        this.someMember = 1;
        this.anotherMember = 'Whatever';

        Module.debug.call(this, 'someMember', 'anotherMember');

        var privateMember = {
            name: 'Rip Steakface',
            battleCry: 'Raaaaaaaaahhhhhhhhhrrrrrrrrrg!'
        };

        Module.debug.call(privateMember, 'name', 'battleCry');
    };

    return Module;
}());

For those who are wondering why you would want to do this, it's just a way to efficiently log multiple variables along with their names.

If you want to be able to log nested members, as in Module.debug.call(obj, 'hair.fluffiness'), you can modify the function like so:

Module.debug = function () {
    var i, j, props, tmp;

    for (i = 0; i < arguments.length; i++) {
        tmp = this;
        props = arguments[i].split('.');

        for (j = 0; j < props.length; j++) {
            tmp = tmp[props[j]];
        }

        console.log(arguments[i] + ':', tmp);
    }
};

Unfortunately, I can't find any way to efficiently log multiple private variables that aren't members of an object, e.g. var roll = 3, value = 4; Module.debug.call(???);

Big McLargeHuge
  • 14,841
  • 10
  • 80
  • 108
1

Not sure you can directly get what you want from JavaScript, since the variable name is not carried around with the value it references (think of variable names as identifiers only the compiler knows about; but which get thrown away at runtime).

You can, however, do something slightly different which allows for passing around named arguments. Create an anonymous object and pass that to your function:

function showNames(o)
{
    for( var ix in o )
    {
       alert( ix + ":" + o[ix] );
    }
}

var z = { x : "Anything" }
showNames( z );
// or
showNames( { a : "ay", b : "bee", c: "see" } )

For iterating object properties, I tend to prefer a functional-style, as in:

Array.iteri = function(o, f)
{
    for(var i in o) { f(i, o[i]) }
}

function showNames(o)
{
    Array.iteri( o, function(i,v)
    {
        alert( i + ": " + v )
    });
}
showNames( { a : "ay", b : "bee", c: "see" } )
James Hugard
  • 3,232
  • 1
  • 25
  • 36
  • 2
    @ally - I was speaking conceptually, but most javascript engines do (or can) compile to intermediate code for performance. AFAIK, only Chrome compiles javascript directly to assembly language. – James Hugard Sep 28 '12 at 20:27
1

The below code is about the best you can do. Unfortunately local variables in a function are properties of the hidden Call Object so they can't be accessed from Javascript like window[a] where a is a property of the window object.

x = "this is x";
var say = function(a) {
    document.write(a + " = " + window[a]);
}
say("x");

var wrapper = function () {
    var x = "this is x";
    document.write(x + " = " + eval("x"))
}
wrapper()
Anon
  • 11
  • 1