從字符串名稱動態創建JavaScript函數

Question

給定一個字符串classname ，我想動態創建一個以該字符串命名的新JavaScript函數，該函數可用於實例化對象。

我嘗試使用eval()但由於某種原因，聲明的函數不會出現在全局（窗口）范圍內。

eval( "function " + classname + "() {}" );
window[ classname ]; // => undefined

有沒有辦法可以動態創建一個以字符串命名的新函數？

或者，或者，通過eval創建它后，給我一些方法來引用創建的函數。 有趣的是，當我在Safari中調試它時，它看起來像一個局部變量。

更新：

得到它了！ 當然很明顯，我只是再次使用eval來創建實例：

var myInstance = eval( "new " + classname );
myInstance.constructor.name; // => classname (yay)

這應該適用於我的情況，因為我只需要在聲明后立即創建一個類的實例。 對於一般情況，雖然看到Pointy的答案。

Answer 1

是：

window[classname] = function() { ... };

現在，誠實地說，這與你的嘗試不完全相同 ，但它非常接近。 當您通過類似的function 表達式實例化函數而沒有名稱時，除了通過外部作用域中的名稱（在本例中為全局作用域）之外，該函數不能引用自身。

如果這很重要，你可以做的是：用一些股票“內部”名稱創建函數，然后將其分配給全局名稱：

function secretName() { ... }

window[classname] = secretName;

Answer 2

function registerFunction(functionBody) {
         "use strict";
         var script = document.createElement("script");
         script.innerHTML = "function " + functionBody;
         document.body.appendChild(script);
}
registerFunction("fooBar(x, y) { return x + y; }");
fooBar(1, 2); // will give you 3

雖然這與eval()基本相同，但它會在當前頁面的域中注冊該函數。 您可以稍后刪除此腳本元素，或將其重用於其他功能。

Answer 3

試試這個：

var classname = "myFunction";

window[ classname ] = function () {};

alert( window[ classname ] ); // => undefined

Answer 4

如果您不想基於某些字符串創建新函數，但基於另一個類似的函數:(這可能不是一個很好的例子，但希望您能得到這個想法）

function createListOfFunctions(functionNameList) {
  resultFunctions = {};

  // Loop all names to create a list of functions with those names
  $.each(functionNameList, function(index, functionName) {
    resultFunctions[functionName] = _createFunction(functionName);
  });

  return resultFunctions;
}

function _createFunction(name) {
  return function(anotherNameToCompare) {
    // customize this funciton whatever you like
    return name == anotherNameToCompare;
  };
}


// USAGE:
functionNameList = ['stack', 'overflow'];
result = createListOfFunctions(functionNameList); // result = { stack: function(name) {...}, overflow: function(name) {...} }

result.stack('stack'); // true
result.stack('not stack'); // false
result.overflow('overflow'); // true