函数声明和求值顺序

在 JavaScript 中，函数是一等公民。这意味着函数可作为变量、参数或返回值使用。但是，在理解函数的基础上，了解它们的声明和求值顺序也很重要。

函数声明

函数声明是通过关键字 function 来创建的，后跟函数名、参数列表以及函数体。例如：

function add(x, y) {
  return x + y;
}

函数声明不仅将函数体分配到一个变量中，还会使其在代码执行前进入内存。这也就是说，可以在调用函数之前声明和定义它，例如：

console.log(add(2, 3)); // 输出 5

function add(x, y) {
  return x + y;
}

函数声明的优点是它们可提升（hoist）到当前作用域的顶部。这意味着无论函数声明在哪里，它都能访问当前函数作用域中的任何变量。例如：

var x = 1;

function add(y) {
  return x + y;
}

console.log(add(2)); // 输出 3

函数表达式

与函数声明不同，函数表达式是将函数分配给变量而不是名称。例如：

const add = function(x, y) {
  return x + y;
};

函数表达式不能提升，因此必须在调用之前声明和定义它。例如：

console.log(add(2, 3)); // 报错：add is not a function

const add = function(x, y) {
  return x + y;
};

还有一种特殊的函数表达式，被称为箭头函数。它们提供了更简洁的语法，并使用 => 运算符来表示函数体。例如：

const add = (x, y) => x + y;

函数求值顺序

在 JavaScript 中，函数声明和函数表达式可以混合使用。但是，当它们与其他代码一起使用时，就会涉及到函数求值顺序。

具体而言，在执行上下文创建阶段，JavaScript 引擎会进行两个独立的步骤：

1. 创建变量对象（Variable Object），其中包括所有变量和函数的声明。
2. 针对代码块中的每个表达式执行代码并将其赋值给相应的变量。

这意味着在执行上下文创建阶段结束之前，函数声明已经存在于作用域中。因此，以下代码运行正常：

console.log(multiply(2, 3)); // 输出 6

function multiply(x, y) {
  return x * y;
}

但是，函数表达式不会提升。它们必须在执行代码块之前声明和定义。因此，以下代码将引发错误：

console.log(subtract(5, 3)); // 报错：subtract is not a function

const subtract = function(x, y) {
  return x - y;
};

在这个例子中，变量 subtract 还没有被定义，因此无法进行调用。解决这个问题的一种方法是将函数表达式移到调用之前：

const subtract = function(x, y) {
  return x - y;
};

console.log(subtract(5, 3)); // 输出 2

总结

了解 JavaScript 中函数声明和求值顺序的概念非常重要。函数声明可以提升并在代码执行前进入内存，而函数表达式必须在调用之前定义。对于任何类型的函数，都应该考虑代码块的执行顺序，并确保它们在调用之前已经声明和定义。

希望通过本文，您对 JavaScript 函数的声明和求值顺序有

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/12109