setInterval 和 setTimeout 定时器
前端定时器 setInterval 和 setTimeout
setInterval 循环执行
循环执行就是设置一个时间间隔,每过一段时间都会执行一次这个方法,直到这个定时器被销毁掉。
用法是setInterval(“方法名或方法”,“延时”), 第一个参数为方法名或者方法,注意为方法名的时候不要加括号,第二个参数为时间间隔(毫秒)。
设置循环执行
this.timer = setInterval(this.updataDevice, 5000)
// 第一个参数:this.updataDevice 是ts中的方法,只写方法名不写括号。
// 第二个参数:5000 表示延时,毫秒,5000毫秒=5秒,即执行完本次后,隔5秒再次执行
销毁定时器
案例是vue写的,用vue举例:
beforeDestroy() { // 组件销毁前执行
clearInterval(this.timer) // 清除定时器
this.timer = null // 定时器的变量赋值null
},
顺便例一下vue的生命周期函数:
beforeCreate: function () {
console.group('beforeCreate 创建前状态===============》');
},
created: function () {
console.group('created 创建完毕状态===============》');
},
beforeMount: function () {
console.group('beforeMount 挂载前状态===============》');//已被初始化
},
mounted: function () {
console.group('mounted 挂载结束状态===============》');
},
beforeUpdate: function () {
alert("更新前状态");
console.group('beforeUpdate 更新前状态===============》'); //这里指的是页面渲染新数据之前
alert("更新前状态2");
},
updated: function () {
console.group('updated 更新完成状态===============》');
},
beforeDestroy: function () {
console.group('beforeDestroy 销毁前状态===============》');
},
destroyed: function () {
console.group('destroyed 销毁完成状态===============》');
}
setTimeout 定时执行
定时执行setTimeout是设置一个时间,等待时间到达的时候只执行一次,但是执行完以后定时器还在,只是没有运行。
用法是 setTimeout(“方法名或方法”, “延时”); 第一个参数为方法名或者方法,注意为方法名的时候不要加括号,第二个参数为时间间隔。
设置定时执行
setTimeout(() => {
this.showMarker() // 执行的方法
}, 1000) // 时间 1000毫秒 = 1秒
【版权声明】本博文著作权归作者所有,任何形式的转载都请联系作者获取授权并注明出处!
【重要说明】博文仅作为本人的学习记录,论点和观点仅代表个人而不代表技术的真理,目的是自我学习和有幸成为可以向他人分享的经验,因此有错误会虚心接受改正,但不代表此刻博文无误!
【博客园地址】叫我+V : http://www.cnblogs.com/wjw1014
【CSDN地址】叫我+V : https://wjw1014.blog.csdn.net/
【Gitee地址】叫我+V :https://gitee.com/wjw1014
【重要说明】博文仅作为本人的学习记录,论点和观点仅代表个人而不代表技术的真理,目的是自我学习和有幸成为可以向他人分享的经验,因此有错误会虚心接受改正,但不代表此刻博文无误!
【博客园地址】叫我+V : http://www.cnblogs.com/wjw1014
【CSDN地址】叫我+V : https://wjw1014.blog.csdn.net/
【Gitee地址】叫我+V :https://gitee.com/wjw1014