JavaScript 中 new Function() 和 new function() 的区别

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 所做的。除此之外,如果我们需要从服务器接收代码字符串来动态创建函数,也可以使用它。

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);
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

linlinlove2

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值