使用JavaScript變量作為函數名？

Question

我在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個函數（createDialog和updateDialog）。 我怎樣才能做到這一點？ 在PHP中，有一個非常簡單的$$ var。 但是我不知道如何在JS中使變量可變。

謝謝

Answer 1

像這樣：

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對象）。

Answer 2

您需要對要在其中創建函數的作用域對象的引用。 如果是全局范圍，則可以使用window ：

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

Answer 3

javascript的全局范圍是window，因此您可以編寫：

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

現在您可以將其稱為window[funcName](); ， window['varfuncname'](); 或varfuncname();

Answer 4

您需要結合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”變量將引用文檔，而不是窗口。

Answer 5

我認為您正在嘗試執行JavaScript中不需要做的事情。 在PHP中，函數傳遞有點麻煩。 在JavaScript中，它優雅而輕松。

您打算如何在以后調用這些功能？ 我猜想您在“ onclick”屬性中將這些函數名稱硬編碼到了HTML中。 通過on*屬性將JavaScript硬編碼到HTML中是一個壞主意。 如果您正在執行此操作，則必須在全局范圍內創建變量（最好避免另一種做法）。 在瀏覽器中，全局對象是window 。 如果在window上定義屬性，則該函數將在全局范圍內可用：

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

假設您在HTML中具有與要創建的函數名稱匹配的onclick屬性。

更好的方法是在將函數綁定到事件時創建函數，甚至不要將它們分配給變量：

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

這將使您的JavaScript和HTML變得更小，更干凈。