代码之家 › 专栏 › 技术社区 › Alex Pliutau

使用javascript变量作为函数名?

function variables javascript

Alex Pliutau · 技术社区 · 14 年前

我在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');
                    }
                }
            });
        };
    }
});

我想在循环中创建2个函数(createddialog和updateddialog)。我该怎么做?在PHP中有非常简单的$$var。但是我不知道如何在JS中创建变量。

谢谢你

5 回复 | 直到 13 年前

SLaks 14 年前

这样地:

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

但是,由于JavaScript函数通过引用捕获变量,因此您的代码将无法按预期工作。
您需要在一个单独的函数内部定义内部函数,以便每个函数都得到一个单独的 key 变量(或参数)。

例如:

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() { ... };
}

您可以这样使用它:

Dialog.create(...);

编辑

您试图用多个与对话框相关的函数污染全局命名空间。
这是一个坏主意;最好将函数组织到名称空间中。

如果您真的想争论全局名称空间,可以这样做:

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]);
}

这将创建到调用的全局函数 createDialog 和 updateDialog .
在正常函数调用中, this 关键字引用全局命名空间(通常是 window 对象)。

RoToRa 14 年前

您需要一个对要在其中创建函数的作用域对象的引用。如果是全局范围,您可以使用 window :

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

aularon 14 年前

javascript全局范围是window,因此您可以编写:

var funcName='varfuncname';
    window[funcName]=function() {
    alert('HI!');
}

现在你可以称之为 window[funcName](); , window['varfuncname'](); 或 varfuncname();

Gooseus 14 年前

你需要结合Slaks和Rotora的答案:

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

for (var i = 0; i < actionNames.length; i++) {
    window[ actionNames[i] + 'Dialog' ] = function() {
        $('#'+ actionNames[i] +'dialog').dialog('destroy');
        $('#'+ actionNames[i] +'dialog').dialog({
            resizable: false,
            height:600,
            width:400,
            modal: true,
            buttons: {
                Cancel: function() {
                    $(this).dialog('close');
                }
            }
        });
    }
}

由于您是在文档就绪事件处理程序中运行此函数,“this”变量将引用文档,而不是窗口。

Neall 14 年前

我认为你在尝试用JavaScript做一些你不需要做的事情。在PHP中,函数传递有点笨拙。在JavaScript中,它优雅而无痛。

您打算以后如何调用这些函数?我猜您已经在“onclick”属性中将这些函数名硬编码到HTML中了。 通过将javascript硬编码到HTML中 on* 属性是个坏主意。 如果这就是您要做的,那么您必须在全局范围内创建变量(最好避免另一种做法)。在浏览器中,全局对象是 window . 如果在上定义属性 窗口 ,该功能将在全球范围内可用:

$(document).ready(function() {
  var myNames = [
    'create',
    'destroy'
  ];
  for (var i = 0; i < myNames.length; i++) {
    window[myNames[i] + 'Dialog'] = function() {
      alert('Hello');
    };
  }
});

假设你有 onclick HTML中与要创建的函数名匹配的属性。

一个更好的方法是在将函数绑定到事件时创建函数,而不将它们分配给变量:

$(document).ready(function() {
  $('#createdialog, #destroydialog').each(function() {
    $(this).click(function() {
      alert('Hello');
    });
  });
});

这将使您的javascript和HTML更小、更清晰。