选择函数的子集作为字符串＆评估

Question

我有一组定义的JS函数。我希望用户使用逗号分隔的字符串选择其中的一部分。然后我想从他们的子集中随机选择，并评估选择的功能。我有99％的工作，除非因为某种原因没有评估。为什么控制台告诉我'undefined不是函数'？

采取偷看在第37行：http://jsfiddle.net/ftaq8q4m/

// 1 User picks a subset of function names as a comma seperated string. 
var effectSubset = 'func4, func5, func6'; 


// 2 Available functions 
    function func1() { 
     $('html').append('func1'); 
    } 

    function func2() { 
     $('html').append('func2'); 
    } 

    function func3() { 
     $('html').append('func3'); 
    } 

    function func4() { 
     $('html').append('func4'); 
    } 

    function func5() { 
     $('html').append('func3'); 
    } 

    function func6() { 
     $('html').append('func4'); 
    } 


var autoPlay = function() { 
    // 3 Get the user's subset of functions, turn into array 
    effectArray = effectSubset.split(','); 
    // 4 Pick random function from array 
    var effect = effectArray[Math.floor(Math.random() * effectArray.length)]; 
    // 5 run the randomly picked function 
    window[effect](); 
} 

// 6 Re-run every second 
var playInterval = setInterval(autoPlay, 1000); 

Answer 1

我可以看到两个错误：

1. 您的功能并没有分配到window
2. 你"effect"变量包含前导空格

我在这里更正了以上几点：http://jsfiddle.net/ftaq8q4m/1/

这似乎解决了您描述的问题。

例子：

window.func1 = function() { 
    $('html').append('func1'); 
} 

和：

window[effect.trim()](); 

---

更新

作为奖励，我定你的misle ading消息附加= d

http://jsfiddle.net/ftaq8q4m/5/

Answer 2

你的做法是行不通的，因为你的函数名 var effectSubset = 'func4, func5, func6';拆分后的变量的影响具有的功能名称前添加一个空格之间的空间。

所以被调用的函数是func4,<space>func5,<space>func6，其空间不存在。

首先，它最好有一个名称空间。

var effectSubset = 'func4,func5,func6'; // <--- remove spaces here or trim like in other answers 
window.myNamespace = {}; 

window.myNamespace.func1 = function() { 
    $('html').append('func1'); 
} 
// ..... define other functions like above 
window["myNamespace"][effect](); // <-- this should work 

这里是一个演示http://jsbin.com/lixeto/edit?html,js,output

Answer 3

这里有两个问题：第一个有领先的空格，您拆分输入和第二，是的jsfiddle您的包裹中的脚本IIFE后。第一个问题可以通过用'，'分割或用修剪函数映射结果数组来解决。第二个问题可以通过创建一个对象来分配函数来解决。看到这个fiddle作为一个工作的例子。

// 1 User picks a subset of function names as a comma seperated string. 
var effectSubset = 'func4, func5, func6'; 


// 2 Available functions 
var funcObj = { 
    func1: function func1() { 
     $('html').append('func1'); 
    }, 

    func2: function func2() { 
     $('html').append('func2'); 
    }, 

    func3: function func3() { 
     $('html').append('func3'); 
    }, 

    func4: function func4() { 
     $('html').append('func4'); 
    }, 

    func5: function func5() { 
     $('html').append('func3'); 
    }, 

    func6: function func6() { 
     $('html').append('func4'); 
    } 
}; 

var autoPlay = function() { 
    // 3 Get the user's subset of functions, turn into array 
    effectArray = effectSubset.split(',').map(function(func) { return func.trim() }); 
    // 4 Pick random function from array 
    var effect = effectArray[Math.floor(Math.random() * effectArray.length)]; 
    // 5 run the randomly picked function 
    funcObj[effect](); 
} 

// 6 Re-run every second 
var playInterval = setInterval(autoPlay, 1000);