新函数（）带有可变参数

Question

我需要使用new Function()构造函数创建一个具有可变数量参数的函数。类似这样的：

args = ['a', 'b']; 
body = 'return(a + b);'; 

myFunc = new Function(args, body); 

是否有可能没有eval()？

---

非常感谢，伙计们！其实，a + b并不是我最关心的问题。我正在处理和扩展模板的代码，我需要将未知（和可变）数量的参数传递给函数，以便将它们作为局部变量引入。

例如，如果一个模板包含：

<span> =a </span> 

我需要输出参数a的价值。也就是说，如果用户宣布扩大功能

var expand = tplCompile('template', a, b, c) 

，然后调用

expand(4, 2, 1) 

我需要替换=a与4。是的，我很清楚功能类似于eval()，运行速度非常慢，但我没有任何其他选择。

Answer 1

可以使用apply()做到这一点：

args = ['a', 'b', 'return(a + b);']; 
myFunc = Function.apply(null, args); 

没有new操作，Function给出完全相同的结果。您可以使用数组函数（如push(),unshift()或splice()）在传递数组之前修改数组。

你也可以通过一个逗号分隔的参数字符串功能：

args = 'a, b'; 
body = 'return(a + b);'; 

myFunc = new Function(args, body); 

在一个侧面说明，你知道arguments对象的？它允许您使用数组式的支架方式就可以得到传递给函数的所有参数：

myFunc = function() { 
    var total = 0; 

    for (var i=0; i < arguments.length; i++) 
     total += arguments[i]; 

    return total; 
} 

myFunc(a, b); 

这将是比使用功能构造更高效，并可能是实现一个更合适的方法是什么你需要。

Answer 2

如果你只是想要一个sum(...)功能：

function sum(list) { 
    var total = 0, nums; 
    if (arguments.length === 1 && list instanceof Array) { 
     nums = list; 
    } else { 
     nums = arguments; 
    } 
    for (var i=0; i < nums.length; i++) { 
     total += nums[i]; 
    } 
    return total; 
} 

然后，

sum() === 0; 
sum(1) === 1; 
sum([1, 2]) === 3; 
sum(1, 2, 3) === 6; 
sum([-17, 93, 2, -841]) === -763; 

如果您想了解更多，请您提供更多的细节？如果你不知道你想要做什么，那么你很难说出你能做些什么。以这种方式

Answer 3

new Function(...) 

声明函数导致 被编译没有的功能，和 潜在地比声明函数的其他 方式慢。

咱们是JSLitmus检查并运行一个小的测试脚本：

<script src="JSLitmus.js"></script> 
<script> 

JSLitmus.test("new Function ... ", function() { 
    return new Function("for(var i=0; i<100; i++) {}"); 
}); 

JSLitmus.test("function() ...", function() { 
     return (function() { for(var i=0; i<100; i++) {} }); 
}); 

</script> 

我上面所做的就是创建一个function expression和function constructor执行相同的操作。结果如下：

FireFox的性能结果

IE性能结果

基于事实，我建议使用function expression代替function constructor

var a = function() { 
var result = 0; 
for(var index=0; index < arguments.length; index++) { 
    result += arguments[index]; 
} 
return result; 
} 
alert(a(1,3)); 

Answer 4

有几种不同的方法可以编写它。

// assign normally 
var ab = ['a','b'].join(''); 
alert(ab); 
// assign with anonymous self-evaluating function 
var cd = (function(c) {return c.join("");})(['c','d']); 
alert(cd); 
// assign with function declaration 
function efFunc(c){return c.join("");} 
var efArray = ['e','f']; 
var ef = efFunc(efArray); 
alert(ef); 
// assign with function by name 
var doFunc = function(a,b) {return window[b](a);} 
var ghArray = ['g','h']; 
var ghFunc = function(c){return c.join("");} 
var gh = doFunc(ghArray,'ghFunc'); 
alert(gh); 
// assign with Class and lookup table 
var Function_ = function(a,b) { 
    this.val = ''; 
    this.body = b.substr(0,b.indexOf('(')); 
    this.args = b.substr(b.indexOf('(')+1,b.lastIndexOf(')')-b.indexOf('(')-1); 
    switch (this.body) { 
    case "return": 
     switch (this.args) { 
     case "a + b": this.val = a.join(''); break; 
     } 
    break; 
    } 
} 
var args = ['i', 'j']; 
var body = 'return(a + b);'; 
var ij = new Function_(args, body); 
alert(ij.val); 

Answer 5

ES5中引入的新功能是reduce数组的方法。 You can use it to sum numbers, and it is possible to use the feature in older browsers with some compatibility code.

Answer 6

@ AndyE的回答是正确的如果构造函数不关心你是否使用new关键字。有些功能不够宽容。

如果你发现自己在一个场景中，你需要使用new关键字，你需要一个可变数量的参数发送到功能，您可以使用此

function Foo() { 
    this.numbers = [].slice.apply(arguments); 
}; 


var args = [1,2,3,4,5]; // however many you want 
var f = Object.create(Foo.prototype); 
Foo.apply(f, args); 

f.numbers;   // [1,2,3,4,5] 
f instanceof Foo; // true 
f.constructor.name; // "Foo" 

---

ES6及更高版本！

// yup, that easy 
 
function Foo (...numbers) { 
 
    this.numbers = numbers 
 
} 
 

 
// use Reflect.construct to call Foo constructor 
 
const f = 
 
    Reflect.construct (Foo, [1, 2, 3, 4, 5]) 
 

 
// everything else works 
 
console.log (f.numbers)   // [1,2,3,4,5] 
 
console.log (f instanceof Foo) // true 
 
console.log (f.constructor.name) // "Foo"

Answer 7

function construct(){ 
     this.subFunction=function(a,b){ 
     ... 
     } 
} 
var globalVar=new construct(); 

与

var globalVar=new function(){ 
       this.subFunction=function(a,b){ 
       ... 
       } 
} 

我喜欢第二个版本，如果有子功能。

Answer 8

当b继承原型时，b.apply（null，arguments）不能正常工作，因为'new'被省略，基础构造函数不会被调用。

Answer 9

在此示例中，我用lodash：

function _evalExp(exp, scope) { 
    const k = [null].concat(_.keys(scope)); 
    k.push('return '+exp); 
    const args = _.map(_.keys(scope), function(a) {return scope[a];}); 
    const func = new (Function.prototype.bind.apply(Function, k)); 
    return func.apply(func, args); 
} 

_evalExp('a+b+c', {a:10, b:20, c:30});