新函數（）帶有可變參數

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