踩坑——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。

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

你可能感兴趣的:(踩坑——js闭包造成的问题)