Dynamic Variables in Javascript  


In Javascript under normal circumstances we create all variable by writing “var ” in our code. But sometimes we might require to create variable at runtime either inside loops or inside some condition. These variables are referred as dynamic variables because these variables are named dynamically. This article will show you code snippet on how can we create dynamic variable in Javascript.

In JavaScript there are 2 ways by which you can create dynamic variables:
1) eval Function
2) window object

EVAL Function:
It is said that eval is one of the most powerful function inside javascript. We can execute javascript code, read JSON Object using eval function. But here we will learn how to create dynamic variable using eval function.

	var data = "testVariable";
	eval("var temp_" + data + "=123;");
	alert(temp_testVariable);

Here i have created an dynamic variable temp_testVariable holding value 123. You can also create arrays using eval function.

	var data = "testVariable";
	eval("var temp_" + data + "= new Array();");
	temp_testVariable[temp_testVariable.length]="Hello World";
	alert("Array Length: " + temp_testVariable.length);
	alert("Array Data: " + temp_testVariable[0]);


 


Window Object:
JavaScript Window Object is the highest level JavaScript object which represents the web browser window.

	//Creating Normal Variable
	var data = "testVariable";
	window["temp_" + data] = 123;
	alert(window["temp_" + data]);
 
	//Creating Arrays
	var data = "testVariable";
	window["temp_" + data] = new Array();
	window["temp_" + data][window["temp_" + data].length]="Hello World";
	alert("Array Length: " + window["temp_" + data].length);
	alert("Array Data: " + window["temp_" + data][0]);





Related Articles:

Categories: Javascript Tags:
  1. D
    January 18th, 2009 at 18:18 | #1

    This is awesome!
    I was looking for this for 5 hours. Thanks!

  2. ad56
    February 27th, 2010 at 06:29 | #2

    thanks – just what i was looking for.

  3. March 1st, 2010 at 05:33 | #3

    Thanks for this article.
    It waz usefull and I learned somting new in JS.

  4. Filip
    April 13th, 2010 at 10:51 | #4

    This is not Working in IE !?

  5. Abhijit
    May 25th, 2010 at 03:58 | #5

    Atleast worked for test program in IE, Now time to implement in real time system.

    Keeping my fingers crossed :) Will let you know if successful …..

    Thanks anyway.

  6. Abhijit
    May 25th, 2010 at 08:47 | #6

    Cheers, Sucessfully implemented … Needed to optimze something to support dynamisam..
    Your saved my day..

    Thanks a lot.

  7. Rohit Jain
    August 18th, 2010 at 02:31 | #7

    U r simply gr8888

  8. riddick
    September 20th, 2010 at 11:02 | #8

    Nicely explained!
    Simple and clear article.

    Thank you

  9. nininho
    March 10th, 2011 at 06:34 | #9

    The eval-function bares security vulnerabilities. So, better decide to use it only if there’s no other way. For object variables, which are hardly accessible or complete inaccessible from the window-object, you can create a object and treat it like an array.

    F.e.

    var firstVariableName = ‘firstKey’;
    var secondVariableName = ‘secondKey’;
    var parameters = {};
    parameters[firstVariableName] = ‘firstValue’;
    parameters[secondVariableName] = ‘secondValue’;

    will result in

    ({firstKey:\firstValue\, secondKey:\secondValue\})

    In my case, i had several dynamic parameters to pass over to the data-option on jQuery.ajax();

    Hope that helps.

  10. April 7th, 2011 at 22:23 | #10

    Above code is very useful to me. Thank u.

  11. Adrian
    May 21st, 2011 at 01:04 | #11

    Thank You! Based on the light you bring I wrote

    function $(x){window[x] = document.getElementById(x);
    return window[x] }

    $(‘txt’).style.height=’100px’; //ok
    txt.style.width=’100px’; //ok

    next step to build “jAdrian” :) ) Thank you again

  12. Adrian
    May 21st, 2011 at 04:29 | #12

    note:
    the advantage of eval(“var …”) is that gives the posiblity to create local variables

  13. June 3rd, 2011 at 10:49 | #13

    Thanks a lot !!! this is what i was looking for :)

  14. RumeshChanchal
    September 23rd, 2011 at 04:10 | #14

    Hello All,
    In java script we create any type of variable by using “var” keyword. The data type of “var” is decided at run type on the basis of value. In this demonstration I had created several types of variable by using “var” keyword………….. for more details check out this link………………
    http://mindstick.com/Articles/e2d167d6-541f-4551-b260-90058aee8587/?Creating%20variable%20in%20java%20script

    Thanks !!!!!

  15. Neelam
    November 16th, 2011 at 04:33 | #15

    Nice one.

  16. iulian
    March 4th, 2012 at 05:48 | #16

    Thanks man, you saved me a lot of time.

  1. February 11th, 2009 at 00:45 | #1
  2. April 2nd, 2010 at 20:00 | #2
  3. March 24th, 2012 at 06:28 | #3
  4. May 8th, 2012 at 18:21 | #4

 

Page optimized by WP Minify WordPress Plugin