如何在带参数的函数内部构建可持续自增的函数？——JavaScript formatter函数自增需求实现

这问题我太懂了！你现在的核心问题是每次调用formatter时，内部的n都会被重新声明为0，导致每次自增都从0开始，自然一直输出1。要让计数在formatter的多次调用之间保持状态，这里有两个实用的解决方案：

方案一：利用闭包保存计数状态 #

通过立即执行函数创建一个闭包，把计数变量放在formatter的外部作用域里，这样变量只会初始化一次，每次调用formatter都能访问到同一个值：

// 用立即执行函数构建闭包，持久化计数变量
const formatter = (() => {
  let count = 0; // 这个变量只会在初始化时赋值一次
  return (val) => {
    count++;
    console.log(count); // 现在会输出1/2/3/4...依次递增
    // 这里可以添加你对val的处理逻辑
  };
})();

方案二：借助函数属性存储状态 #

因为JavaScript里函数也是对象，我们可以直接给formatter函数添加一个属性来保存计数，不用额外的闭包结构：

const formatter = (val) => {
  // 第一次调用时初始化计数
  if (!formatter.count) {
    formatter.count = 0;
  }
  formatter.count++;
  console.log(formatter.count); // 同样会输出递增的数值
  // 处理你的val逻辑
};

注意事项 #

如果你的页面会多次触发formatter的初始化（比如路由切换后重新渲染），记得在需要重置计数的时候手动清零：

• 闭包方案：可以重新创建formatter实例，或者在闭包里加一个重置方法
• 函数属性方案：直接执行formatter.count = 0即可

内容的提问来源于stack exchange，提问作者Kobayashi