JavaScript中的函数声明和函数表达式的差异

翻滚的胖子
2023-06-19 11:19:20
JavaScript PHP Java

在JavaScript中，函数是一等公民，是一种特殊的对象类型。函数可以被赋值给变量，也可以作为参数传递给其他函数。函数声明和函数表达式是两种定义函数的方式，它们在语法上有一些差异，本文将详细讲解这些差异。

函数声明

函数声明是一种以function关键字开头的语句，用于定义一个函数。函数声明会被JavaScript引擎提前解析并注册到作用域链中，所以可以在函数声明之前调用。

function add(a, b) {
  return a + b;
}

console.log(add(1, 2)); // 3

以上代码定义了一个add函数，接受两个参数a和b，返回它们的和。可以在函数声明之后调用该函数，输出3。

函数表达式

函数表达式是一种将函数赋值给变量的方式，它也以function关键字开头，但是不同于函数声明的是，它没有函数名。函数表达式需要在赋值之后才能调用。

var add = function(a, b) {
  return a + b;
};

console.log(add(1, 2)); // 3

以上代码定义了一个变量add，并将一个匿名函数赋值给该变量。该函数接受两个参数a和b，返回它们的和。需要在赋值之后调用该函数，输出3。

差异

函数声明和函数表达式在语法上有一些差异，主要包括：

函数声明会被JavaScript引擎提前解析并注册到作用域链中，而函数表达式需要在赋值之后才能调用。
函数声明可以在函数声明之前调用，而函数表达式必须在赋值之后才能调用。
函数声明的函数名可以在函数体内部访问，而函数表达式的函数名只能在函数外部访问。

因此，在编写代码时需要根据实际情况选择使用函数声明还是函数表达式，以达到最佳的代码效果。

案例

以下是一个使用函数表达式定义的计算器：

var calculator = {
  add: function(a, b) {
    return a + b;
  },
  subtract: function(a, b) {
    return a - b;
  },
  multiply: function(a, b) {
    return a * b;
  },
  divide: function(a, b) {
    return a / b;
  }
};

console.log(calculator.add(1, 2)); // 3
console.log(calculator.subtract(2, 1)); // 1
console.log(calculator.multiply(2, 3)); // 6
console.log(calculator.divide(6, 3)); // 2

以上代码定义了一个calculator对象，包含add、subtract、multiply和divide四个函数。这些函数都是使用函数表达式定义的，可以通过calculator对象调用。

本文为翻滚的胖子原创文章,转载无需和我联系,但请注明来自猿教程iskeys.com