作为一等公民，JS 中的函数拥有哪些能力？

2023-12-03 15:28:04

JavaScript 中的函数：一等公民的力量

前言：
在 JavaScript 中，函数不仅仅是代码块，它们是具有多种能力的一等公民。了解这些能力对于充分利用 JavaScript 的强大功能至关重要。

函数作为参数
JavaScript 函数可以像普通变量一样传递给其他函数。这意味着您可以将函数作为参数传递给另一个函数，并使用它来执行特定任务。这种能力被称为函数作为参数的传递。例如：

// 定义一个名为 greet 的函数，它接收一个名称并打印问候语
function greet(name) {
  console.log(`Hello, ${name}!`);
}

// 定义一个名为 sayHello 的函数，它将 greet 函数作为参数并调用它
function sayHello() {
  greet("John");
}

// 调用 sayHello 函数
sayHello(); // 输出：Hello, John!

函数作为返回值
JavaScript 函数还可以从其他函数返回。这意味着您可以创建返回函数的函数。这种能力被称为函数作为返回值的返回。例如：

// 定义一个名为 createGreeter 的函数，它接收一个名称并返回一个闭包
function createGreeter(name) {
  return function() {
    console.log(`Hello, ${name}!`);
  };
}

// 定义一个名为 greeter 的变量，它存储了 createGreeter 函数的返回值
const greeter = createGreeter("John");

// 调用 greeter 变量，它会执行返回的函数
greeter(); // 输出：Hello, John!

函数表达式
JavaScript 函数可以作为表达式来使用。这意味着您可以将函数分配给变量或将其作为参数传递给其他函数。这种能力被称为函数表达式。例如：

// 定义一个名为 greet 的函数表达式，它接收一个名称并打印问候语
const greet = function(name) {
  console.log(`Hello, ${name}!`);
};

// 调用 greet 函数表达式
greet("John"); // 输出：Hello, John!

匿名函数
JavaScript 函数可以没有名称。这些函数被称为匿名函数。匿名函数通常用作回调或立即执行函数表达式 (IIFE)。例如：

// 定义一个匿名函数，它打印 "Hello, world!"
const greet = function() {
  console.log("Hello, world!");
};

// 调用匿名函数
greet(); // 输出：Hello, world!

高阶函数
JavaScript 函数可以接受其他函数作为参数，或者返回其他函数。这些函数被称为高阶函数。高阶函数允许您创建灵活且可重用的代码。例如：

// 定义一个名为 map 的高阶函数，它接收一个数组和一个回调函数
function map(array, callback) {
  const results = [];
  for (let i = 0; i < array.length; i++) {
    results.push(callback(array[i]));
  }
  return results;
}

// 定义一个名为 doubledNumbers 的数组，它存储了一些数字
const numbers = [1, 2, 3, 4, 5];

// 使用 map 函数创建一个名为 doubledNumbers 的新数组，它包含原始数组中每个数字的两倍
const doubledNumbers = map(numbers, function(number) {
  return number * 2;
});

// 输出 doubledNumbers 数组
console.log(doubledNumbers); // 输出：[2, 4, 6, 8, 10]

闭包
JavaScript 函数可以访问其创建时的作用域，即使该作用域已结束。这种现象被称为闭包。闭包使函数能够访问和修改外部作用域中的变量。例如：

// 定义一个名为 createCounter 的函数，它返回一个闭包
function createCounter() {
  let count = 0;

  return function() {
    count++;
    return count;
  };
}

// 定义一个名为 counter 的变量，它存储了 createCounter 函数的返回值
const counter = createCounter();

// 调用 counter 变量多次以增加计数器
console.log(counter()); // 输出：1
console.log(counter()); // 输出：2
console.log(counter()); // 输出：3

柯里化
JavaScript 函数可以部分应用。这意味着您可以创建一个新函数，它将原始函数的某些参数绑定到特定值。这种技术被称为柯里化。例如：

// 定义一个名为 add 的函数，它接收两个数字并返回它们的和
function add(a, b) {
  return a + b;
}

// 创建一个名为 add5 的新函数，它将 add 函数的部分应用于数字 5
const add5 = add.bind(null, 5);

// 调用 add5 函数
console.log(add5(10)); // 输出：15