new Function的用法


先来看2个案例

案例1:

var params= "{name:12,id:\"dddaa\"}"
var obj=new Function("return" +params)()
obj //{name: 12, id: 'dddaa'}

案例2:

var func1 = new Function('name', 'return "Hello, " + name + "!";');
func1('Ghostheaven'); // Hello, Ghostheaven!

new Function函数

函数的语法:

let func = new Function(...args, body);

…args是参数,可以有任意个,最后一个参数是函数体。

参数也可以以逗号分隔的列表的形式给出,这三个意思相同:

new Function('a', 'b', 'return a + b'); // 基础语法
new Function('a,b', 'return a + b'); // 逗号分隔
new Function('a , b', 'return a + b'); // 逗号加空格分隔

例如:

//正常的函数
function add(x,y){
    return x + y
}

//用new Function
var add=new Function('x','y','return x+y')

闭包(Closure)

通常,函数将它所创建的位置记录在特殊属性[[Environment]]中。 它引用了创建地点的词法环境。

但是当使用new Function()创建函数时,其[[Environment]]不是引用当前的词法环境,而是引用全局环境。

function getFunc(){
    let value="test";
    let func=new Function('alert(value)');
    return func;
}

getFunc()(); //error:value is not defind

与常规方法比较:

function getFunc(){
    let value="test";
    let func=function(){ 
        alert(value) 
    };
    return func;
}
getFunc()(); //"test",来自getFunc的词法环境

这个特殊的new Function 表面看起来很奇怪,但是在实践中非常有用。

想象一下,我们必须从字符串创建一个函数。在编写脚本时不知道该函数的代码(这就是我们不使用常规函数的原因),但在执行过程中将会知道。我们可能会从服务器或其他来源收到它。

我们的新函数需要与主脚本进行交互。

也许我们希望它能够访问外部的局部变量?

问题是在JavaScript发布到生产之前,它是使用minifier压缩的– 一个通过删除额外的注释,空格来缩小代码的特殊程序,而且,重要的是,会将局部变量重命名为较短的变量。

例如,如果一个函数中有let userName, 那么minifier会替换它为let a (或者如果a被占用,则用另一个字母替换),这个过程会在任何地方进行。这通常是一件安全的事情,因为被替换的变量是局部的,函数外部没有任何东西可以访问它。并且在函数内部,,minifier取代了它的每一个提及。Minifiers很聪明,他们会分析代码结构,所以他们不会破坏任何东西。他们不是只会愚蠢地发现和替换。

但是,如果new Function可以访问外部变量,那么它将无法找到userName, 因为userName 在代码缩小后才作为字符串传入。

所以,即使我们可以在 new Function中 访问外部词汇环境,我们也会遇到 minifiers的问题。

而这时,new Function的“特色”可以让我们免于犯错。

它强制执行更好的代码。如果我们需要将某些东西传递给由new Function创建的函数,我们应该将它作为参数显式传递(可以避免直接读取外部变量时产生的问题)。

我们的“sum”函数实际上是这样正确使用的:

let sum = new Function('a', 'b', 'return a + b');
let a= 1. b = 2;
//外部变量作为参数传入
alert(sum(a,b)); //3

文章作者: 弈心
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 弈心 !
评论
  目录