JavaScript 函数是一等公民

摘要：本教程将介绍 JavaScript 中函数作为一等公民的概念。这意味着您可以将函数存储在变量中，将其作为参数传递给其他函数，或从其他函数中返回它们作为值。

一等公民（First-Class Citizen）是指在一个编程语言中，具有与其他数据类型相同地位和功能的数据类型。在JavaScript中，函数可以作为变量赋值、作为参数传递、作为返回值返回，以及可以作为对象的属性等。

将函数存储在变量中

在 JavaScript 中，函数是一等公民。换句话说，您可以像对待其他类型的值一样对待函数。

以下定义了 add() 函数，并将该函数赋值给变量 sum：

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

let sum = add;

在赋值语句中，我们没有在 add 函数名后添加括号 ()，因此我们引用的是函数本身，而不是执行它。

通过这种方式，我们可以通过两种方式来执行函数。例如，我们可以像通常那样调用它：

let result = add(10, 20);

或者，我们可以通过变量 sum 来调用 add() 函数：

let result = sum(10, 20);

将函数作为参数传递给其他函数

由于函数是值，您可以将它们作为参数传递给其他函数。

例如，以下声明了一个 average() 函数，它接受三个参数，第三个参数是一个函数：

function average(a, b, fn) {
    return fn(a, b) / 2;
}

现在，您可以将 sum 函数作为参数传递给 average() 函数：

let result = average(10, 20, sum);

完整示例：

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

let sum = add;

function average(a, b, fn) {
    return fn(a, b) / 2;
}

let result = average(10, 20, sum);

console.log(result); // 输出：15

从函数中返回函数

由于函数是值，您可以从另一个函数中返回一个函数。

以下的 compareBy() 函数返回一个函数，该函数根据属性比较两个对象：

function compareBy(propertyName) {
  return function (a, b) {
    let x = a[propertyName],
        y = b[propertyName];

    if (x > y) {
      return 1;
    } else if (x < y) {
      return -1;
    } else {
      return 0;
    }
  };
}

请注意，a[propertyName] 返回对象 a 的 propertyName 属性的值。这等同于 a.propertyName。然而，如果 propertyName 包含空格，如 'Discount Price'，则需要使用方括号表示法来访问它。

假设您有一个产品对象数组，每个产品对象都有两个属性：name 和 price。

let products = [
    {name: 'iPhone', price: 900},
    {name: 'Samsung Galaxy', price: 850},
    {name: 'Sony Xperia', price: 700}
];

您可以通过调用 sort() 方法来对数组进行排序。sort() 方法接受一个函数作为参数，该函数用于比较数组的两个元素。

例如，您可以通过传递从 compareBy() 函数返回的函数来根据名称对产品对象进行排序：

console.log('Products sorted by name:');
products.sort(compareBy('name'));
console.table(products);

输出：

Products sorted by name:
┌─────────┬──────────────────┬───────┐
│ (index) │       name       │ price │
├─────────┼──────────────────┼───────┤
│    0    │ 'Samsung Galaxy' │  850  │
│    1    │  'Sony Xperia'   │  700  │
│    2    │     'iPhone'     │  900  │
└─────────┴──────────────────┴───────┘

同样，您可以根据价格对产品对象进行排序：

console.log('Products sorted by price:');
products.sort(compareBy('price'));
console.table(products);

输出：

Products sorted by price:
┌─────────┬──────────────────┬───────┐
│ (index) │       name       │ price │
├─────────┼──────────────────┼───────┤
│    0    │  'Sony Xperia'   │  700  │
│    1    │ 'Samsung Galaxy' │  850  │
│    2    │     'iPhone'     │  900  │
└─────────┴──────────────────┴───────┘

---

通过上述示例，您可以看到 JavaScript 中函数作为一等公民的强大功能。这种特性使得函数可以像其他值一样被操作，从而提供了更大的灵活性和表达力。