有多少人不知道，函数的参数还能是函数呢

前面给大家分享了函数传参的相关内容，介绍了基本类型和引用类型传参的区别，没有说函数，其实在 JavaScript 中，函数被认为是一种特殊的对象类型。

今天我们来聊一聊函数作为参数，会怎么样呢？

1. 函数

我们来回顾一下函数的基本概念。

函数是一段被命名和封装的可重复使用的代码块，它接受输入（也称为参数），执行特定的任务，并可能返回一个结果。

function add(x, y) {
  return x + y;
}

2. 函数作为参数

函数可以作为参数传递给其他函数。

是的，你没听错，函数本身也可以成为一个特殊的“东西”，就像数字、字符串一样可以被传递和操作。

让我们通过一个简单的例子来看看这个“函数作为参数”是怎么回事。

function higherOrderFunction(callback) {
  console.log("执行高阶函数");
  callback();
}

function myCallbackFunction() {
  console.log("我是回调函数");
}

higherOrderFunction(myCallbackFunction);

这段代码中，higherOrderFunction 是一个高阶函数，接受一个函数作为参数callback 。

在函数内部调用了这个传递进来的函数 callback ，这就是函数作为参数的基本原理。

3. 使用场景

跟大家分享几个常用的使用场景。

回调函数

回调函数是函数作为参数最常见的用例之一。通过将函数传递给另一个函数，可以实现在某个事件发生时执行特定的操作。

function fetchData(callback) {
  // 模拟异步数据请求
  setTimeout(function() {
    const data = { name: 'John', age: 25 };
    callback(data);
  }, 1000);
}

function processUserData(userData) {
  console.log(`处理用户数据：${userData.name}, 年龄：${userData.age}`);
}

// fetchData接受一个回调函数，数据准备好后执行回调
fetchData(processUserData);

数组操作

通过将函数作为参数传递给数组的高阶函数，可以实现各种灵活的数组操作，如映射、过滤、排序等。

const numbers = [1, 4, 2, 7, 3, 9];
// 使用map函数，将每个元素平方
const squaredNumbers = numbers.map(function(num) {
  return num * num;
});
console.log(squaredNumbers); // 输出: [1, 16, 4, 49, 9, 81]

定时器异步操作

在处理定时器和异步操作时，函数作为参数可以用于指定在操作完成后执行的回调函数。

function delayedAction(callback, delay) {
  setTimeout(callback, delay);
}
function afterDelay() {
  console.log('延迟后执行的操作');
}
// 在1000毫秒后执行afterDelay函数
delayedAction(afterDelay, 1000);

事件处理

在前端开发中，通过将函数作为事件处理函数传递给事件监听器，可以实现对特定事件的定制处理。

const button = document.getElementById('myButton');

function handleButtonClick() {
  console.log('按钮被点击了！');
}

// 将handleButtonClick函数作为点击事件的处理函数
button.addEventListener('click', handleButtonClick);

4. 结语

这些例子只是函数作为参数的冰山一角。在实际开发中，你会发现函数作为参数，使得你的代码更容易适应不同的场景和需求。

希望你可以在实际编程中多多尝试，通过动手实践来巩固所学知识~