理解 javascript 中的函数表达式与函数声明

理解 JavaScript 中的函数表达式与函数声明可以使程序员能够更好地理解 JavaScript 的特性和行为，从而更好地编写 JavaScript 代码。下面是一个完整攻略：

1. 函数表达式与函数声明的定义

在JavaScript中，函数表达式和函数声明都可以用来定义函数。二者的主要区别是函数声明在代码块范围内的提升机制不同。

函数声明会被预处理到程序的顶部，因此在代码块中任何地方都可以被访问到：

foo(); // 能够被调用，因为函数声明被预处理
function foo() {
  console.log("Hello World!");
}

而函数表达式则只会在程序运行到定义语句时才被创建，因此在其定义语句之前访问或调用会报错：

foo(); // Uncaught TypeError: foo is not a function
var foo = function() {
  console.log("Hello World!");
}

2. 函数表达式与函数声明的语法

函数声明的语法类似于以下代码：

function functionName() {
  // 函数体
}

函数表达式的语法类似于以下代码：

var functionName = function() {
  // 函数体
}

3. 函数表达式和函数声明的区别

函数声明和函数表达式不仅仅是在语法上的区别，还会影响变量和函数的作用域。

函数声明对于整个代码块是可见的，而函数表达式只能在定义时访问。特定的函数表达式在函数内部被定义，所以它们不能被外部代码访问。例如：

if (x) {
  function foo() { console.log("1"); }
} else {
  function foo() { console.log("2"); }
}

上述代码在某些引擎中会运行正常，在某些引擎中则会抛出语法错误，因此不建议在代码块中使用函数声明。

在上述代码中，由于 if 条件块中的两个函数声明具有相同的名称和参数，因此可能会发生“覆盖函数”的情况。在这种情况下，代码的逻辑可能会变得混乱，而且在不同的 JavaScript 引擎中也可能会产生不同的结果，因此应该避免使用函数声明。

相反，函数表达式显式地将函数分配给变量，并且只能在定义变量的作用域中使用。例如：

if (x) {
  var foo = function() { console.log("1"); }
} else {
  var foo = function() { console.log("2"); }
}

在上述代码中，foo() 函数只能在 if 和 else 代码块中使用，并将被赋值为一个函数表达式。这符合 JavaScript 中的最佳实践。

4. 示例说明

以下是一个使用函数表达式和函数声明的示例：

// 函数声明 - 代码块内的提升
console.log(add(2, 3)); // 5
function add(a, b) {
  return a + b;
}
console.log(add(4, 5)); // 9

// 函数表达式 - 赋值给变量
console.log(subtract(5, 2)); // Uncaught ReferenceError: subtract is not defined
var subtract = function(a, b) {
  return a - b;
}
console.log(subtract(7, 4)); // 3

在第一个函数声明示例中，JavaScript 引擎会在代码块的顶部预处理 add() 函数，在调用函数之前即可在代码块中访问。

在第二个函数表达式示例中，JavaScript 引擎无法预处理 subtract()，因为它是被赋值给变量的函数表达式。如果在代码块顶部调用 subtract()，将会得到计算机无法找到函数的 ReferenceError 错误。