JavaScript function with variable value in the name

Hi E's, I want to know if it is possible do this thing, and how:
I have this 3 functions, cena1(), cena2() and cena3(), and I will call the function of the value of the variable number (var number = x), x can be 1,2 or 3.
So, when I call the function cena?(), I have to put the value of the variable in the name of the function in (?).
How I do that?

The best regards, JC
LVL 3
Pedro ChagasWebmasterAsked:
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

x
 
Big MontyConnect With a Mentor Senior Web Developer / CEO of ExchangeTree.org Commented:
Store your functions in an object instead of making them top level.

var cena = {
    cena1: function() { },
    cena2: function() { },
    cena3: function() { }
};
Then you can access them like any other object:

cena['cena' + num]();
You could also access them directly from the window object…

window['cena' + num]();
… and avoid having to store them in an object, but this means playing in the global scope which should be avoided.
0
 
Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
personally, i would just use the index number as a javascript parameter, and define the different sections from within one function, instead of playing around with the global scope so much...
0
 
Pedro ChagasWebmasterAuthor Commented:
Hi @big_monty, thanks for your attention.
Tell me one thing please, is not possible put the variable directly in the name of the function, something like cena'number'(){...}?
I believe your solution is the best when I start the project (beginning), my project are in the end, and I need just to know how I put the name of the variable in the name of the function.
Thank you.
~JC
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
Big MontyConnect With a Mentor Senior Web Developer / CEO of ExchangeTree.org Commented:
in short, no, you cannot embed a variable name within a JS function in the manner you are attempting
0
 
Pedro ChagasWebmasterAuthor Commented:
In that case, I have to follow your solution.
I will try later, and I give you feedback.
Thank you again.
~JC
0
 
Pedro ChagasWebmasterAuthor Commented:
Hi, I try your solution and seems work well, but I have a problem in my bellow code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<script>
var numero = 1;

var cena = {
    cena1: function() { num1(); },
    cena2: function() { num2(); },
    cena3: function() { num3(); }
};

cena['cena' + numero]();

function funcao(){
    function num1(){
        document.write("1");
    }
    function num2(){
        document.write("2");
    }
    function num3(){
        document.write("3");
    }
    
}

</script>
</body>
</html>

Open in new window

In Firebug the problem is "num1 is not defined".
num1, 2 or 3, are inside function "funcao", seems not be a global function.
I make this question because this code example is the closest replica to my real code, and I have to find a solution.
Is there a solution, or should I open a new question for this new problem?

~JC
0
 
Pierre CorneliusConnect With a Mentor Commented:
Try this instead:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<script type="text/javascript">
var numero = 1;

function funcao(){
    this.num1 = function (){document.write("1");}	
    this.num2 = function (){document.write("2");}	
    this.num3 = function (){document.write("3");}   
}
var funcs = new funcao();
var cena = [
    function cena1() { funcs.num1(); },
    function cena2() { funcs.num2(); },
    function cena3() { funcs.num3(); }
];

cena[numero-1]();

</script>
</body>
</html>

Open in new window


or even simpler:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<script type="text/javascript">
var numero = 1;

var cena = [
    function cena1() { document.write("1");},
    function cena2() { document.write("2");},
    function cena3() { document.write("3");}
];

cena[numero-1]();

</script>
</body>
</html>

Open in new window


I do agree with Bi Monty however. Something like this would have been better:
function better_cena(anumero) {
	switch (anumero)
	{
		case 1: document.write("Execute code if numero = 1"); break;
		case 2: document.write("Execute code if numero = 2"); break;
		case 3: document.write("Execute code if numero = 3"); break;
		default: document.write("Unsupported numero:"+anumero);
	}
}

Open in new window

You can call like this:
  better_cena(1);
  better_cena(2);
  better_cena(3);
  better_cena(4);
0
 
Sar1973Connect With a Mentor Commented:
If you have a generic function that uses an argument, call it cena(myArg) and declare it as cena(x) {.....}, using directly x as an arguments of the lines of code inside the function.
Is that what you're asking for...?
0
All Courses

From novice to tech pro — start learning today.