《正在努力成长为小牛的路上》--setInterval与setTimeout定时器变量冲突问题

最近在看刘未鹏老师的《暗时间》，深感自己浪费的时间太多了，于是想一点点把时间捡起来用来学习。作为一个菜鸟，也深知自己不会的确实太多了，没关系，慢慢学！但是今天写代码实在是太受挫了，想了好久才发现问题！真是没想到会以这种方式来开始我《正在努力成长为小牛的路上》系列的第一篇博客。

背景：想用定时器实现一个在多个可拖拽的，用来显示监控任务情况的div里，定时切换内容的功能。

用setTimeout实现：

用setInterval实现：

两者实现效果都相同（我觉得这两种写法的效果相同，如果有大牛能指出不同小女子也非常愿意学习！毕竟我还是个菜鸟，接触的不多，所以下的定论并没有考虑完善），单把每一个div拖出来都可以正确切换内容，但是若先把coffee拖出来，再把curtain拖出来，则两个div都变静止。但若再将第一个或者第二个div拖出来，则拖出来的那个div，以及跟他之前相同模板的div都可以正常切换，另外一个仍然无法正常运行。

想了好多原因，比如是不是定时器冲突啊，或者资源抢占啊，最后发现，原来通过<script>标签加载的js代码最后是会自己拼接起来的，所以没有写进闭包的变量都是全局变量，所以我之前在两个<script>里分别定义的currentIndex其实是冲突的同名全局变量。

最后为了能让多个定时器更好地运行，也尽量减少出现在代码中的各种各样容易让人眼花缭乱的变量名，提高一下阅读体验，写成如下的闭包模板：