JavaScript函数是复用的基础设施,通过function声明与箭头函数的this差异、灵活参数设计(默认值/剩余参数/解构)及闭包封装私有状态实现可控复用。

JavaScript 函数不是“提升复用性”的装饰品,而是让复用成为可能的基础设施。没有函数,每次用到相同逻辑都得复制粘贴;有了函数,只需一次定义、多处调用。
function 声明 vs 箭头函数:语法和 this 行为差异直接影响复用场景
两种定义方式在行为上关键不同,选错会导致 this 绑定失效、无法作为构造函数、或意外丢失上下文 —— 这些都会让本想复用的函数在不同调用位置出错。
-
function声明会变量提升(hoisting),可在定义前调用;箭头函数不会,必须先声明再使用 - 箭头函数不绑定自己的
this,它继承外层作用域的this;普通函数的this取决于调用方式(如obj.fn()中this是obj) - 需要动态
this(比如事件处理器、对象方法)时,别用箭头函数;需要保持外层this(比如回调中访问组件实例)时,箭头函数更安全
参数设计:默认值、剩余参数和解构让函数真正适配多变输入
硬编码参数个数或顺序会严重限制复用。合理利用参数机制,才能让一个函数应对多种调用方式。
- 用
function foo(a = 1, b = 'default') {}避免对可选参数手动判空 - 用
function sum(...nums) { return nums.reduce((a, b) => a + b, 0); }支持任意数量数字相加 - 对象参数 + 解构可读性强且易扩展:
function createUser({ name, age = 18, role = 'user' }) { ... },调用时只传关心的字段,新增字段也不破坏旧调用
闭包封装私有状态:复用 ≠ 全局暴露,而是可控共享
函数复用常被误解为“写一次、到处 import”,但更多时候,复用的是“带记忆的能力”——比如计数器、缓存、配置工厂。这靠闭包实现。
立即学习“Java免费学习笔记(深入)”;
- 返回函数形成闭包:
const makeAdder = (x) => (y) => x + y; const add5 = makeAdder(5); add5(3); // 8 - 模块级私有变量:
let cache = new Map(); export function getFromCache(key) { if (cache.has(key)) return cache.get(key); const val = expensiveCalc(key); cache.set(key, val); return val; }—— 多次调用共享同一cache实例 - 注意:闭包会持续持有对外部变量的引用,不当使用可能导致内存无法释放
函数复用的难点不在语法,而在边界控制:参数要不要默认、this 该不该绑定、状态该不该隔离。这些决定往往出现在第 3 次调用该函数时才暴露出来 —— 到那时,改就比重写还费劲。











