Programatically output variable and object names as literal text strings
<p>I'd really like to track variables without switching between Firebug console windows or clicking around so much, so I want to draw a runtime viewer of variable names and their corresponding values that will display on the page of the app I am building. </p>

<p>I'd like to two functions, show(variableName) and freeze(variableName). They will output both the variable's value and the name of the variable or object as a literal string which will serve as the text label in the viewer. freeze(variableName) is the same as show(variableName) except with a setTimeOut timer for tracking loops.</p>

<p>I'm sure I'm missing something basic, but I haven't found out a way to get the string that comprises the name of a value programmatically so I can use it as a label. I guess I could create the table with hardcoded labels prior to runtime and just populate it with values at runtime, but I really want to generate the table dynamically so it only has those variables I specifically want to show or freeze. Simple functions:</p>

<p>foo1 = "Rock";
show(foo1);</p>

<p>foo2 = "Paper";
show(foo2);</p>

<p>foo3 = "Scissors";
show(foo3);</p>

<p>should output this via getElementById('viewer-table'):</p>

<p><code>&lt;table&gt;\&lt;tr&gt;&lt;td&gt;foo1&lt;/td&gt;&lt;td&gt;Rock&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;foo2&lt;/td&gt;&lt;td&gt;Paper&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;foo3&lt;/td&gt;&lt;td&gt;Scissors&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;</code></p>

<p>I've tried this solution:</p>

<p><a href="http://stackoverflow.com/questions/417645/how-to-convert-variable-name-to-string-in-javascript">http://stackoverflow.com/questions/417645/how-to-convert-variable-name-to-string-in-javascript</a></p>

<p>and eval() but it's not working for me...I dunno, shouldn't this be easy? Getting frustrated...</p>

<p>Thanks,
motorhobo</p>
