踩坑——js 闭包造成的问题

由于这3个月工作忙，好久没有在简书上写文章了，今天给大家分享一个我在项目中遇到的js闭包的坑。

• 踩坑背景
  在公司的触屏端项目中，用的react+redux，我们的方法都是统一在params.js中传递给对应的组件。我现在有一个需求：列表页滑到底部，需要重新请求接口，请求接口时需要把上一次接口返回的数据总数这个字段传给接口，即：

  假设我有一个变量totalNum，用于保存每一次接口返回的数据总数；
  $.ajax({
    url: '.../orders/my',
    data: {
     num: totalNum,
     ...
    },
    type: 'get',
    cache: false
  });

  在实际的项目中，我定义了一个reducer变量用于保存这个数据总数，在接口的成功回调函数中，会修改这个reducer。我天真的以为：

  我一开始在state中取到的这个reducer数据（totalNum），虽然在window.onscroll中绑定了，但每次scroll时，都会重新从state中取最新的totalNum。

上面的描述可能比较抽象，下面列出了一个很简单的模型：

  
  
  
  Document
  


  点击
  

上面的这段代码：

• 在页面初始化完成时，点击按钮，这个时候alert出来1，这个大家肯定都没问题；

• 那么，当过了5s中，定时器执行完 totalNum = 5后，这个时候会弹出什么结果呢？ 答案还是1，不是5。

希望看到这篇文章能对你有用~