Using counter in variable name

Question

This is what I have currently but I cant get v(i) to behave the same as v1. What am I doing wrong? I've also tried the piece below which also did not work.

var x = "v" + i;
alert(x);

My main problem is the following:

var v1 = document.getElementById("thing1").innerHTML; // = 100
var v2 = document.getElementById("thing2").innerHTML; // = 150
var v3 = document.getElementById("thing3").innerHTML; // = 200

for (i = 0; i < 4; i++) {
    if ( v(i) != ""){
        alert(v(i));
        }
}

Thanks in advance:)

You are calling v as a function when you put parenthesis after it. — Chip Dean
– Chip Dean, Commented Mar 23, 2017 at 16:02
@NinaScholz Could you explain what you mean? I'm a complete novice sorry. — user6892979
– user6892979, Commented Mar 23, 2017 at 16:02
@ChipDean What should I do then if I want to use 'v' then the counter number? — user6892979
– user6892979, Commented Mar 23, 2017 at 16:04

Chip Dean · Accepted Answer · 2017-03-23 16:04:57Z

1

What you are trying to do is not easily accomplished. You would have to assign the variable to the window object and then print it from there.

A much better solution is to use your own object or array to handle this:

var v1 = document.getElementById("thing1").innerHTML; // = 100
var v2 = document.getElementById("thing2").innerHTML; // = 150
var v3 = document.getElementById("thing3").innerHTML; // = 200
var array = [v1,v2,v3];
for (i = 0; i < 4; i++) {
    if ( array[i] != ""){
        alert(array[i]);
        }
}

answered Mar 23, 2017 at 16:04

Chip Dean

4,3023 gold badges27 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Anton Stepanenkov · Accepted Answer · 2017-03-23 16:06:45Z

0

All global variables are properties of window object you could use window['v'+ i] or this['v'+ i] to create them. But this is very bad pattern consider using object instead.

answered Mar 23, 2017 at 16:06

Anton Stepanenkov

1,0368 silver badges15 bronze badges

Comments

DoXicK · Accepted Answer · 2017-03-23 16:27:15Z

What you are trying to do is get an interpolated variable name, which is not possible in javascript the way you do it.

You can do this using this['v'+i] or window['v'+i] which are both bad ideas in the global scope.

v(i) actually means: run function v(...) with parameter i

If i would write your example code in easy to understand javascript, i would come up with this:

for(var i = 1; i <= 4; i++)
{
    var html = document.getElementById('thing'+i).innerHTML;
    alert(html);
}

If you want your values in an array, in a way that you don't write the same code 6 times:

var ids = ['thing1','thing2','thing3','thing4'];

// es5
  var values = [];
  for(var i = 0; i < ids.length; i++)
  {
     var html = document.getElementById( ids[i] ).innerHTML;
     values.push( html );
  }
  // values now contains all the values of the elements

// OR es 6
  var values = ids.map(function(id) { return document.getElementById(id).innerHTML; });
  // or
  var values = ids.map(id => document.getElementById(id).innerHTML);

Nina Scholz · Accepted Answer · 2017-03-23 16:27:53Z

0

You could use an array without using single variables and loop it.

var array = [
        '100', // document.getElementById("thing1").innerHTML,
        '150', // document.getElementById("thing2").innerHTML,
        '200'  // document.getElementById("thing3").innerHTML
    ],
    i;

for (i = 0; i < array.length; i++) {
    if (array[i] !== "") {
        console.log(array[i]);
    }
}

If you need some keys, you could use an object.

var object = {
        v1: '150', // document.getElementById("thing1").innerHTML,
        v2: '200', // document.getElementById("thing2").innerHTML,
        v3: '250', // document.getElementById("thing3").innerHTML
    },
    i;

for (i = 1; i <= 3; i++) {
    if (object['v' + i] !== "") {
        console.log(object['v' + i]);
    }
}

edited Mar 23, 2017 at 16:27

answered Mar 23, 2017 at 16:06

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Collectives™ on Stack Overflow

Using counter in variable name

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related