javascript确实很灵活,但它也带来了一些混乱。例如,你可以使用多种方式来做同一件事情,比如创建函数、对象等。那么标题中提到的两者有什么区别呢?
new function 是另一种创建函数的方式,其语法:
const func = new function ([arg1, arg2, ...argn], functionbody);
一个简单的例子:
const sum = new function('a', 'b', 'return a + b'); sum(1 + 2); // 3
嗯,这提供了很大的灵活性。这并不常见,但在某些情况下可以使用它。例如,当我们需要将模板动态编译为函数时,我们可以使用它,据我所知,这就是 vue.js 所做的。除此之外,如果我们需要从服务器接收代码字符串来动态创建函数,也可以使用它。
立即学习“Java免费学习笔记(深入)”;
让我们快速谈谈它的特点。看看下面的代码会输出什么?
globalthis.a = 10; function createfunction1() { const a = 20; return new function('return a;'); } function createfunction2() { const a = 20; function f() { return a; } return f; } const f1 = createfunction1(); console.log(f1()); // ? const f2 = createfunction2(); console.log(f2()); // ?
答案是10和20。这是因为new function总是在全局范围内创建函数。运行时只能访问全局变量和它们自己的局部变量。
而 new function() 的目的是创建一个新对象并应用匿名函数作为构造函数。比如下面的例子:
const a = new (function () { this.name = 1; })(); console.log(a); // { name: 1 }
就是这样。实际上,每个 javascript 函数都是一个 function 对象,换句话说,(function () {}).constructor === function returns true。
关联的一个知识点是如何使用new function()创建异步函数? mdn给了我们答案:
// Since `AsyncFunction` is not a global object, we need to get it manually: const AsyncFunction = (async function () {}).constructor; const fetchURL = new AsyncFunction('url', 'return await fetch(url);'); fetchURL('/') .then((res) => res.text()) .then(console.log);
如果您发现这有帮助,请考虑 订阅我的时事通讯 以获取更多有关 web 开发的有用文章和工具。感谢您的阅读!