Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Use JavaScript variable as function name?

I have the following code in Javascript:

jQuery(document).ready(function(){
    var actions = new Object();
    var actions;
    actions[0] = 'create';
    actions[1] = 'update';
    for (key in actions) {
        // Dialogs
        var actions[key]+Dialog = function(){
            $('#'+actions[key]+'dialog').dialog('destroy');
            $('#'+actions[key]+'dialog').dialog({
                resizable: false,
                height:600,
                width:400,
                modal: true,
                buttons: {
                    Cancel: function() {
                        $(this).dialog('close');
                    }
                }
            });
        };
    }
});

I want to create 2 functions in loop(createDialog and updateDialog). How can i do this? In PHP there is very simple $$var. But how make variable variable in JS I don't know.

Thank you

like image 518
Alex Pliutau Avatar asked Sep 01 '10 14:09

Alex Pliutau


People also ask

Can a function name be a variable?

Variables are local to the program in which they appear, so one function can have a variable or argument named x and another function can have a variable or argument of the same name, and there is no confusion.

Can function name and variable name be same in JavaScript?

What is it you would expect? Variables and functions share the same namespace in JavaScript, so they override each other. if function name and variable name are same then JS Engine ignores the variable.

How do you name variables and functions in JavaScript?

Naming ConventionsVariable and function names written as camelCase. Global variables written in UPPERCASE (We don't, but it's quite common) Constants (like PI) written in UPPERCASE.

Can I assign a function to a variable JavaScript?

You can work with functions as if they were objects. For example, you can assign functions to variables, to array elements, and to other objects. They can also be passed around as arguments to other functions or be returned from those functions. The only difference with objects is that functions can be called.


2 Answers

Like this:

actions[key + "Dialog"] = function () { ... };

However, since Javascript functions capture variables by reference, your code will not work as intended.
You need to define the inner function inside of a separate function so that each one gets a separate key variable (or parameter).

For example:

var actionNames = [ 'create', 'update' ];   //This creates an array with two items
var Dialog = { };    //This creates an empty object

for (var i = 0; i < actionNames.length; i++) {
    Dialog[actionNames[i]] = createAction(actionNames[i]);
}

function createAction(key) {
    return function() { ... };
}

You can use it like this:

Dialog.create(...);

EDIT

You are trying to pollute the global namespace with multiple dialog-related functions.
This is a bad idea; it's better to organize your functions into namespace.

If you really want to polute the global namespace, you can do it like this:

var actionNames = [ 'create', 'update' ];   //This creates an array with two items

for (var i = 0; i < actionNames.length; i++) {
    this[actionNames[i] + 'Dialog'] = createAction(actionNames[i]);
}

This will create to global functions called createDialog and updateDialog.
In a normal function call, the this keyword refers to the global namespace (typically the window object).

like image 118
SLaks Avatar answered Oct 05 '22 19:10

SLaks


You'll need a reference to the scope object in which you want to create the functions. If it's the global scope you can use window:

window[ actions[key] + "Dialog" ] = function(){ ... }
like image 34
RoToRa Avatar answered Oct 05 '22 19:10

RoToRa