webapp 慎用setInterval、setTimeout

其实这片文章刚开始我啥也没写的，但也有20多的访问量，所以觉得大家还是比较关注这个问题，所以找机会写下。

问题的引出：

为什么我说的时webapp中慎用setInterval、setTimeout， 既然这么说肯定时要强调两点：

　1、 webapp 下， 这里的webapp我主要想说的时单页应用（SPA）

　2、 慎用， 慎用说明还是可以用的，但要注意。

一、 我们知道 　setInterval、setTimeout 时基于 window下的。  看截图

　　

而SPA项目又有一个特别的地方就是切换页面时，整个页面时不会重新刷新的，以 setInterval 为例，最常见的就是 登入页面60s短信验证码。当你在60s之内你已经完成登入操作了，并且跳转到别的页面，而因为时spa项目，window是不会刷新的，所以即使你跳转到别的页面，你的  setInterval  还在运行， 就算你代码中 用了clearInterval，但也是要60s 之后才会去清除，而此时你早已经登入成功去做别的了， 当你设置的时间过多，或者你的项目中使用setInterval、setTimeout过多。 对你手机内存消耗时不可小觑的，会影响用户流畅度。

　　　　

问题解决：

那怎么解决呢： 很简单，就是你跳转页面的时候去主动 clearInterval 一下， 这个时候你就要统一的去管理所有 setTimeout setInterval 生成的timer。

window.app = { timers : [] };

var timer = setInterval(function( )  {console.info('a')}, 1000);

app.timers.push(timer);

var timer1 = setInterval(function( )  {console.info('b')}, 1000);

app.timers.push(timer1);

//当你页面跳转时，统一去 clearInterval， 因为一般做单页的，跳转等函数都是封装的了，你只要在封装的地方加上下面的代码就可以了。

app.timers.forEach(function (item) {
　　clearInterval(item);
});

上面的代码都是自己直接 手写的，连编辑器都没用，不确保正常跑起来， 但思路就是这么个意思，这篇文章也主要是讲这么个思路，抛砖引玉之用， 希望能举一反三， 对webapp下的其它全局函数是不是也要注意这个问题呢？ 大家可以一起探讨。