setInterval的问题和setTimeout代替实现,以及延伸出的问题

setInterval不足:累积效应,在重复时间内要执行的操作耗时比重复时间长,会快速触发操作,损耗性能,效果差

一些浏览器还会有不同的问题,比如低版本火狐,在滚动条滚动时,计时器会停止执行,等滚动条停止时,事件一次触发,这段事件累计的计时器

当页面中有计时器,把页面放到后台一段时间,计时器会暂停,再切回到页面,这段时间累计的计时器会高速的执行(比如W3school)

还有一些问题,解决办法就是,可以用setTimeout替代

<button class="stop">ClearTimeOut</button>
		<script type="text/javascript">
			let Time,callT;
			Time = setTimeout(function () {
				callT = setTimeout(arguments.callee, 1000); //要想arguments有效不能用箭头函数,箭头函数是匿名函数找不到argumengs
				console.log(callT);//4,5,6,7....
				console.log(Time);//1,1,1,1....
				console.log(typeof Time)//number
				console.log(typeof callT)//number
			}, 1000)
			document.querySelector('.stop').onclick = function() {
					clearTimeout(callT)
			}
		</script>

setTimeout实现setInterval的功能很简单,但是这里发现了两个现象,不知作何解释,也搞不明白
1,计时器的类型打印发现是number,
2,打印计时器结果外边的一直时一个值,里面递归的计时器值在一直增加,而且还会有不同结果。
在这里插入图片描述
我朋友在通知台打印的
在这里插入图片描述
一个比一个懵,不止哪位大神能为在下答疑解惑,不胜感激

发布了117 篇原创文章 · 获赞 146 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/printf_hello/article/details/104856822
今日推荐