摘要：本教程将介绍 JavaScript 中函数作为一等公民的概念。这意味着您可以将函数存储在变量中，将其作为参数传递给其他函数，或从其他函数中返回它们作为值。
一等公民（First-Class Citizen）是指在一个编程语言中，具有与其他数据类型相同地位和功能的数据类型。在JavaScript中，函数可以作为变量赋值、作为参数传递、作为返回值返回，以及可以作为对象的属性等。
将函数存储在变量中
在 JavaScript 中，函数是一等公民。换句话说，您可以像对待其他类型的值一样对待函数。
以下定义了 add() 函数，并将该函数赋值给变量 sum：
|
1 2 3 4 5 6 |
function add(a, b) { return a + b; } let sum = add; |
在赋值语句中，我们没有在 add 函数名后添加括号 ()，因此我们引用的是函数本身，而不是执行它。
通过这种方式，我们可以通过两种方式来执行函数。例如，我们可以像通常那样调用它：
|
1 2 |
let result = add(10, 20); |
或者，我们可以通过变量 sum 来调用 add() 函数：
|
1 2 |
let result = sum(10, 20); |
将函数作为参数传递给其他函数
由于函数是值，您可以将它们作为参数传递给其他函数。
例如，以下声明了一个 average() 函数，它接受三个参数，第三个参数是一个函数：
|
1 2 3 4 |
function average(a, b, fn) { return fn(a, b) / 2; } |
现在，您可以将 sum 函数作为参数传递给 average() 函数：
|
1 2 |
let result = average(10, 20, sum); |
完整示例：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
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() 函数返回一个函数，该函数根据属性比较两个对象：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
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。
|
1 2 3 4 5 6 |
let products = [ {name: 'iPhone', price: 900}, {name: 'Samsung Galaxy', price: 850}, {name: 'Sony Xperia', price: 700} ]; |
您可以通过调用 sort() 方法来对数组进行排序。sort() 方法接受一个函数作为参数，该函数用于比较数组的两个元素。
例如，您可以通过传递从 compareBy() 函数返回的函数来根据名称对产品对象进行排序：
|
1 2 3 4 |
console.log('Products sorted by name:'); products.sort(compareBy('name')); console.table(products); |
输出：
|
1 2 3 4 5 6 7 8 9 |
Products sorted by name: ┌─────────┬──────────────────┬───────┐ │ (index) │ name │ price │ ├─────────┼──────────────────┼───────┤ │ 0 │ 'Samsung Galaxy' │ 850 │ │ 1 │ 'Sony Xperia' │ 700 │ │ 2 │ 'iPhone' │ 900 │ └─────────┴──────────────────┴───────┘ |
同样，您可以根据价格对产品对象进行排序：
|
1 2 3 4 |
console.log('Products sorted by price:'); products.sort(compareBy('price')); console.table(products); |
输出：
|
1 2 3 4 5 6 7 8 9 |
Products sorted by price: ┌─────────┬──────────────────┬───────┐ │ (index) │ name │ price │ ├─────────┼──────────────────┼───────┤ │ 0 │ 'Sony Xperia' │ 700 │ │ 1 │ 'Samsung Galaxy' │ 850 │ │ 2 │ 'iPhone' │ 900 │ └─────────┴──────────────────┴───────┘ |
通过上述示例，您可以看到 JavaScript 中函数作为一等公民的强大功能。这种特性使得函数可以像其他值一样被操作，从而提供了更大的灵活性和表达力。
总结
通过以上示例，我们可以看到函数作为一等公民在JavaScript中的重要性。函数不仅可以像其他数据类型一样被赋值、传递和返回，还可以通过高阶函数等技术实现更加灵活和可重用的代码。因此，在JavaScript编程中，理解和掌握函数作为一等公民的概念是非常重要的。