JS特殊函数(Function()构造函数、函数直接量)区别介绍

JS中的函数(Function)是非常重要的概念。在JS中，有三种创建函数的方式：函数直接量、Function()构造函数和箭头函数。其中，函数直接量和Function()构造函数的功能和用法相似，但也有一些区别。

函数直接量

函数直接量是定义函数最简单的方式之一。它就是将一个函数的定义放在一个表达式中，这个表达式可以被赋值给一个变量，或者直接被调用。

函数直接量的语法如下：

function functionName(/*参数列表*/) {
  // 函数体
}

函数直接量是可以使用匿名函数的，例如：

let addNumbers = function(x, y) {
  return x + y;
}

这个函数可以通过变量addNumbers来调用。我们也可以不用变量来接收函数，直接使用自调用函数：

(function(x, y) {
  console.log(x + y);
})(2, 3);

这个函数被定义后会自动调用，输出结果为5。

Function()构造函数

JS中还有一种创建函数的方式就是Function()构造函数。它不同于函数直接量，它可以接受任意数量的参数，并且将最后一个参数作为函数体，其他的参数都作为新函数的参数。

Function()构造函数的语法如下：

new Function(arg1, arg2, ..., functionBody)

arg1,arg2,...表示新函数的参数，与函数直接量一样，可以省略，functionBody则表示新函数体。

例如，下面这个例子可以通过Function()构造函数定义一个匿名函数：

let addNumbers = new Function("x", "y", "return x + y;");
console.log(addNumbers(2, 3)); // 输出 5

需要注意的是，使用Function()构造函数创建函数，会永久增加函数的作用域，可能导致一些性能问题。

区别介绍

虽然函数直接量和Function()构造函数可以完成同一个任务，但它们之间还是有一些区别。

语法区别

首先，函数直接量的语法更为简单，只需要一个function关键字就可以了。而使用Function()构造函数必须使用new关键字，而且需要在括号里传递参数和函数体。

作用域区别

其次，使用Function()构造函数创建的函数，永久增加函数的作用域，可能导致一些性能问题。而函数直接量不会增加作用域。所以在大型项目中，最好使用函数直接量而不是Function()构造函数。

下面是一个示例，演示了在循环中使用Function()构造函数会导致作用域问题：

for(var i = 0; i < 5; i++) {
  var func = new Function("console.log(i);");
  func();
}

这段代码会输出5个5，而不是1-5逐个输出。这是因为使用Function()构造函数创建的函数，会永久增加函数的作用域，这时i已经是循环结束后的值了。

而使用函数直接量的代码，是一个正常的闭包，不会出现作用域问题：

for(var i = 0; i < 5; i++) {
  var func = function(x) {
    return function() {
      console.log(x);
    }
  }(i);
  func();
}

这段代码会输出1-5逐个输出，因为使用函数直接量创建的函数和变量i形成一个闭包，保证了每次循环时i的值都是不同的。

综上所述，虽然Function()构造函数也可以创建函数，但使用函数直接量是更常见、更简单、更优化的方式。

阅读剩余 46%