本文介绍如何通过闭包机制，让函数内部的数组在多次调用中持续累积数据，避免污染全局作用域，同时保持封装性与可维护性。
本文介绍如何通过闭包机制，让函数内部的数组在多次调用中持续累积数据，避免污染全局作用域，同时保持封装性与可维护性。
在 JavaScript 中，函数每次执行时都会创建全新的局部作用域，因此像 const array = [] 这样的声明在每次调用中都会被重新初始化——这正是原始代码始终只返回单元素数组的根本原因。若希望数组状态跨调用保留，又不想将其暴露为全局变量，闭包（Closure） 是最自然、最符合语言设计哲学的解决方案。
核心思路：利用 IIFE 构建私有状态
通过立即执行函数表达式（IIFE），我们可以在外部函数作用域中声明并初始化数组，再将一个引用该数组的内部函数作为返回值。由于内部函数“捕获”了外层作用域中的 array，它便拥有了对该数组的持久访问权——即形成了闭包。
以下是推荐实现：
const addToArray = (function() {
const array = []; // ✅ 私有、持久、非全局
return function(param) {
array.push(param);
return [...array]; // 可选：返回副本以增强不可变性
};
})();
console.log(addToArray('abc')); // ['abc']
console.log(addToArray(2)); // ['abc', 2]
console.log(addToArray('text')); // ['abc', 2, 'text']? 关键点解析：
- array 仅在 IIFE 执行时初始化一次，后续所有对 addToArray 的调用共享同一份引用；
- 外部无法直接访问 array，实现了真正的封装；
- 返回 array 的浅拷贝（[...array]）可防止外部意外修改内部状态，提升健壮性（如需高性能且确定外部不会篡改，可直接返回 array）。
替代方案对比与注意事项
| 方案 | 是否推荐 | 原因 |
|---|---|---|
| 全局变量 let array = [] | ❌ 不推荐 | 破坏模块隔离，易引发命名冲突和副作用 |
| 函数属性（如 addToArray.array = []） | ⚠️ 谨慎使用 | 属性可被外部读写，违背封装原则，且语义不清晰 |
| useRef（React 场景） | ✅ 仅限 React 函数组件 | 利用 Hooks 提供的引用保持能力，但属框架特定方案 |
| 类封装（class ArrayCollector） | ✅ 适合复杂逻辑 | 更显式、可扩展性强，但轻量场景略显冗余 |
总结
闭包不是“黑魔法”，而是 JavaScript 作用域链的自然体现。它使我们能优雅地在函数级别维护私有状态，既规避了全局污染，又无需引入额外依赖或框架。对于此类“累积型”工具函数，IIFE + 闭包是最简洁、最标准的实践方式。记住：状态的生命周期应由其使用场景决定，而闭包，正是连接作用域与生命周期的桥梁。
