CODEWITHSUNDEEP
javascripthtmlconcatenation
Arun kumar M
Arun kumar M

Reputation: 13

Concatenation doesn't seem to work in JavaScript

I am doing something like this in my application. I have sequence of Id values like ID1, ID2 etc. I am trying to fetch the ID value using for loop.

Concatenation doesn't seem to work.

function Save(count,Id1,Id2,Id3){
  var response = [];
  for(var i=1;i <= count; i++) {
    value = `${'Id' + i}`;
    alert(value);
  }
}
<input type="button" value="Submit" onclick="Save(3,1,2,3)" />

Upvotes: 0

Views: 55

Answers (3)

DontVoteMeDown
DontVoteMeDown

Reputation: 21465

That doens't works because will throw a syntax exception. Its not the way you use interpolation. There are lots of ways to do what you need in a simple way:

  • Using an array:

function Save(ids) {
  var response = [];
  for(var i=0;i < ids.length; i++) {
    value = ids[i];
    console.log(value);
  }
}

Save([1,2,3,4]);

  • Using arguments constant:

function Save(){
  var response = [];
  for(var i=0;i < arguments.length; i++) {
    value = arguments[i];
    console.log(value);
  }
}

Save(1,2,3,4);

Upvotes: 0

blex
blex

Reputation: 25634

You're creating a String "Id1", you cannot interpolate a variable name. But with ES6, you can use the rest parameters (...) to convert parts of your arguments to an Array:

function Save(count, ...ids) {
  var response = [];
  for (var i = 0; i < count; i++) {
    value = ids[i];
    alert(value);
  }
}
<input type="button" value="Submit" onclick="Save(3,1,2,3)" />

Before ES6, you would have to use arguments (that would convert all arguments):

function Save() {
  var response = [];
  for (var i = 1; i <= arguments[0]; i++) {
    value = arguments[i];
    alert(value);
  }
}
<input type="button" value="Submit" onclick="Save(3,1,2,3)" />

Or use eval, but don't. This is just for the example:

function Save(count, Id1, Id2, Id3, Id4) {
  var response = [];
  for (var i = 1; i <= count; i++) {
    value = eval(`Id${i}`);
    alert(value);
  }
}
<input type="button" value="Submit" onclick="Save(3,1,2,3)" />

Upvotes: 3

CherryDT
CherryDT

Reputation: 29011

That's not how interpolation works. It just inserts the value of the expression into a string. For example:

const age = 30
console.log(`I am ${age} years old!`) // Prints "I am 30 years old"

It doesn't interpret a string as an expression, which is what you apparently want to do. You could do that using eval, but this is most likely a step into the wrong direction.

If you want to iterate over the given values, just use an array instead:

function save (values) {
  for (const value of values) {
    alert(value)
  }
}
<input type="button" value="Submit" onclick="save([9, 8, 7])" />

You can also iterate manually over the indexes, that can be useful if you need the index too, for example:

function save (values) {
  for (let i = 0; i < values.length; i++) {
    alert(`Index ${i} = ${values[i]}`)
  }
}
<input type="button" value="Submit" onclick="save([9, 8, 7])" />

Or, if you want to keep your method of calling the function with multiple arguments (although the count argument is completely unnecessary), you can destructure the arguments into an array, like this:

function save (...values) {
  for (let i = 0; i < values.length; i++) {
    alert(`Index ${i} = ${values[i]}`)
  }
}
<input type="button" value="Submit" onclick="save(9, 8, 7)" />

If you really wanted that count argument there, you could use function save (count, ...values). As a side note, there is also arguments, which is an array-like object that holds all the arguments passed to your current function, so you could iterate over that as well.

Upvotes: 0

Related Questions