CODEWITHSUNDEEP
javascript
JVG
JVG

Reputation: 21170

Javascript - Declare variables with a for loop

I'm just wondering if it's possible to declare multiple variables using a for loop in Javascript.

Example: I have 4 <article> elements whose Ids are article1 article2 article3 and article4. Instead of declaring each variable independently, I'd like to do it in a loop (as they use essentially the same code and I don't want to repeat myself!).

Something like:

window.ready = function(){
    for (var i=1; i<=4; i++){

            var article[i] = document.getElementById("article" + i);

        }
}

The above returns an error with an unexpected [, so my syntax must be off (I'm very new to JS), but (a) is this on the right track and (b) will these be global variables if I run them in a window.ready function?

Upvotes: 3

Views: 15288

Answers (6)

Felipe Oriani
Felipe Oriani

Reputation: 38638

You cannot set a variable name with [ char. Using it, you will get an exception of javascript. You can use a List/Array to do this, try with Array class, something like:

window.ready = function() {

   var articles = new Array();

   for (var i=1; i<=4; i++){

      articles[i] = document.getElementById("article" + i);

   }
}

With Array class, you are not required to specify the lenght, but if you want, you can set it on the constructor.

var articles = new Array(4);

Another approach is use the push method to add elements on the array, for sample:

window.ready = function() {

   var articles = []; // define an empty array

   for (var i=1; i<=4; i++){

      articles.push(document.getElementById("article" + i));

   }
}

Upvotes: 6

MrCode
MrCode

Reputation: 64536

Instead of that you could just grab all of the <article> elements:

var articles = document.getElementsByTagName("article");

// access them in a loop
for(var i=0; i<articles.length; i++)
{
    console.log("Hey I'm " + articles[i].id);
}

Upvotes: 1

Sovan
Sovan

Reputation: 104

Declare the array before using the array Ex : var article = []; // shorter version of new Array() then write your code as it is...

Hope this will help

Upvotes: 0

freakish
freakish

Reputation: 56577

You can try using eval:

for (var i = 1; i <= 4; i++) {
    eval( 'var article'+i+' = document.getElementById("article' + i +'");' );
}

This will work like normal variables and they will be visible only in a local scope. This is probably a bad practice though, so just create an array or hash table to store dynamic variables.

Upvotes: 1

isNaN1247
isNaN1247

Reputation: 18109

Firstly its important to note that JavaScript functions have function scope rather than block scope meaning that 'article' is not unique to your for loop. Therefore declaring var article within your for block may be misleading as to what actually happens at runtime.

To achieve what you're after the following should work:

window.ready = function(){
    var article = [];
    for (var i=1; i<=4; i++){

            article.push(document.getElementById("article" + i));

        }
}

References

Upvotes: 4

ddev
ddev

Reputation: 389

You are creating a new Article Array everytime you loop through..

Create an Article Array before entering your "for" loop.

article = new Array(4);
    for (var i=1; i<=article.length; i++){

            article[i] = document.getElementById("article" + i);

        }

Upvotes: 2

Related Questions