JavaScript函数可重用性关键在参数设计、副作用控制和边界处理：优先用箭头函数写工具函数，递归场景用函数声明；长参数改配置对象解构；避免隐式依赖和副作用，输入输出需明确可预测。
JavaScript 函数不是“写一次就完事”的工具，可重用性的关键不在语法形式，而在参数设计、副作用控制和边界处理。
函数声明 vs 箭头函数：什么时候该用哪一种
声明式函数（function foo() {}）会被提升，能被调用在定义之前；箭头函数（const foo = () => {}）不会提升，且没有自己的 this 和 arguments。如果你写的是工具函数（比如格式化日期、深克隆），优先用箭头函数 + const 声明，避免意外覆盖；如果函数需要递归调用自身（如树遍历），必须用函数声明——因为箭头函数没有函数名，无法在内部安全引用自己。
- 需要
arguments对象？只能用传统函数声明 - 作为事件处理器且需访问 DOM 元素的
this？传统函数更可控（或显式.bind()） - 用于
map/filter等高阶函数？箭头函数更简洁，避免function冗余嵌套
参数设计：别让调用方猜你要什么
避免长参数列表（超过 3 个就危险），尤其当其中部分参数常为 undefined 或默认值时。改用单个配置对象：
// ❌ 容易记混顺序，调用时一堆 undefined
formatDate(date, 'YYYY-MM-DD', true, false, 'UTC')
// ✅ 明确意图，新增字段不影响旧调用
formatDate(date, { format: 'YYYY-MM-DD', withTime: true, utc: true })
同时，在函数内部用解构 + 默认值兜底：
立即学习“Java免费学习笔记（深入）”；
function formatDate(date, { format = 'YYYY-MM-DD', withTime = false, utc = false } = {}) {
// 实现逻辑
}
- 必填参数仍建议保留为独立形参（如
date），增强调用时的错误提示 - 配置对象本身设默认值
= {}，防止传undefined导致解构报错 - 避免在默认值里写复杂表达式（如
new Date()），它会在每次调用时重复执行
避免隐式依赖和副作用：重用的前提是“可预测”
一个函数若读取或修改外部变量（如全局 localStorage、DOM 节点、模块级计数器），就很难被复用或测试。例如：
// ❌ 隐式依赖 document，无法脱离浏览器环境
function toggleMenu() {
document.getElementById('menu').classList.toggle('open')
}
// ✅ 输入输出明确，行为可预测
function toggleClass(element, className) {
element.classList.toggle(className)
return element
}
- 把 DOM 元素、API URL、配置项等都作为参数传入，而非在函数内硬编码或从闭包捕获
- 不修改传入的对象/数组（除非函数名明确表示，如
sortByInPlace()），优先返回新数据 - 异步函数统一返回
Promise，不要在内部直接.then()或操作 UI
真正难的不是写出语法正确的函数，而是判断哪些状态该由调用方负责、哪些该封装进函数内部——这个分界线划错了，再“通用”的函数也会在第二个项目里失效。
