为何在返回函数中n++与n+1的表现存在差异？

问题背景 #

给定一个整数n，返回一个计数器函数。该函数初始返回n，后续每次调用时返回比前一次值大1的结果（n, n + 1, n + 2等）。

首次尝试代码（无效） #

const createCounter = function(n) {
    return function() {
        return n + 1;
    };
};

const counter = createCounter(10)
// 输出结果
console.log(counter()) // 11
console.log(counter()) // 11
console.log(counter()) // 11

这段代码每次调用都返回11，无法实现递增需求。

修正后的代码（有效） #

const createCounter = function(n) {
    return function() {
        return n++;
    };
};

const counter = createCounter(10)
// 输出结果
console.log(counter()) // 10
console.log(counter()) // 11
console.log(counter()) // 12

修改后的代码成功通过测试，实现了每次调用返回递增数值的效果。

核心差异解析 #

两者看似都和数值递增相关，却一个有效一个无效，关键在于是否修改闭包中变量n的实际存储值：

1. n + 1：仅做运算，不修改原变量 #

n + 1是单纯的表达式计算，它只会基于当前n的值算出加1的结果，但不会改变原变量n的存储值。闭包中的n始终是初始传入的10，所以每次调用返回的都是10 + 1 = 11，自然无法实现递增。

2. n++：先返回原值，再更新变量 #

n++是后置自增运算符，属于赋值操作：

• 第一步：返回当前n的原始值（第一次调用时是10）；
• 第二步：将n的值加1并重新赋值给原变量（第一次调用后n变为11）；
  每次调用都会更新闭包中n的状态，后续调用就能基于更新后的n值返回递增结果。

如果想用n + 1实现同样效果，需要主动修改原变量，比如写成：

const createCounter = function(n) {
    return function() {
        n = n + 1;
        return n;
        // 或者直接写 return ++n;（前置自增，先加1再返回）
    };
};

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