闭包相关问题：调用setCount后无法获取更新后的变量值

核心问题 #

你这段代码无法获取更新后值的原因是基本类型的值传递特性，以及未建立内部状态与外部变量的关联：

• 当调用A.operateState(1)时，内部的_value初始化为1，返回数组的第一个元素是_value的值拷贝（number属于基本类型，传递的是值而非引用）。
• 调用setCount(2)时，确实修改了内部的_value，但外部的count变量是之前拷贝的1，和内部_value已无关联，所以打印结果还是1。

修复方案 #

方案1：用对象包裹状态（利用引用类型特性）

对象是引用类型，传递的是地址，外部变量与内部状态指向同一个对象，修改内部对象属性时外部能同步感知：

const A = (() => {
  const operateState = <T>(initialValue: T): [{ value: T }, (value: T) => void] => {
    const _value = { value: initialValue };
    const setState = (newValue: T) => {
      _value.value = newValue;
    };
    return [_value, setState];
  };
  return {
    operateState,
  };
})();

console.clear()
const [count, setCount] = A.operateState(1);
console.log(count.value) // 1
setCount(2)
console.log(count.value) // 2

方案2：添加状态获取函数（模拟响应式基础逻辑）

通过返回一个获取状态的函数，每次调用都能拿到最新的内部值：

const A = (() => {
  const operateState = <T>(initialValue: T): [() => T, (value: T) => void] => {
    let _value = initialValue;
    const setState = (newValue: T) => {
      _value = newValue;
    };
    // 返回获取最新状态的函数
    return [() => _value, setState];
  };
  return {
    operateState,
  };
})();

console.clear()
const [getCount, setCount] = A.operateState(1);
console.log(getCount()) // 1
setCount(2)
console.log(getCount()) // 2

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