setInterval 和setTimeout 清空定时器,返回值,赋值为null的区别
setInterval 和setTimeout 清空定时器,返回值,赋值为null的区别
1.定时器的返回值
定时器是有返回值得,返回值代表着是第几个定时器,类型是number类型,也可以用来取消定时器,它是定时器的唯一标识符。
var num = 1;
function fn() {
var timer = setInterval(function () {
console.log(num);
console.log(timer)
}, 1000);
};
fn();//1,1
解释:timer的值一定是1,number类型,因为一直是这个定时器在不断的执行所以它的返回值始终是1,返回值的作用就是作为一个引用,指向setInterval,我们也可以用它来清楚定时器 clearInterval(timer)。再看下面代码,内容不变,只加了一个调用。
var num = 1;
function fn() {
var timer = setInterval(function () {
console.log(num);
console.log(timer)
}, 1000);
};
fn();//1,1
fn();//2,2
解释:因为再一次调用了,出现了第2个定时器,所以当第2次调用时,timer的值变成了2,当然清除定时器你也可以直接用clearInterval(2);现在你知道定时器的返回值是什么了吧?返回值是一个数字,代表当前是第几个定时器而已。
2.定时器赋值为null和清除定时器不是同一个概念
很多人可能会误认为定时器复制为null就等于清楚了定时器,这个是个错误的理解。上面说了 timer只不过是setInterval的一个引用而已,你赋值timer为null,只不过是清除了timer这个变量,清除了timer的内存占用,setInterval还是存在的。看下面的代码
var num = 1;
function fn() {
var timer = setInterval(function () {
console.log(num);
timer = null;
console.log(timer);
}, 1000);
};
fn();//1,null 1,null 1,null .....
解释:赋值了timer为null 但是还是一直输出1,就说明定时器更本没有清除。清除定时器只能用clearInterval(timer)。
var num = 1;
function fn() {
var timer = setInterval(function () {
console.log(num);
console.log(timer);
clearInterval(timer);
}, 1000);
};
fn();//1,1
解释:这样就只输出一次1,1,因为后面清除了定时器。在页面创建了大量的自定义对象,但是调用后内存无法释放,即使刷新或跳到其它页面,内存仍然没有清空,只有关闭浏览器,内存才释放,长时间使用系统会造成客户端报“虚拟内存不足,所以很多人会清除了定时器再赋值null可以释放内存占用
var num = 1;
function fn() {
var timer = setInterval(function () {
console.log(num);
clearInterval(timer);
timer =null;
}, 1000);
};
fn();//1
3. 关于定时器参数问题
相信很多人觉得定时器就2个参数,第一个是个function函数,第二个是个延时时间,这个是我们平时用的最多的。其实并不是这样的,我拿setTimeout为例来说下:
1.第一个参数函数,第二个参数为delay时间
var num = 1;
function fn() {
var timer = setTimeout(function () {
console.log(num);
}, 1000);
};
fn();//1
解释:因为 num变量在定时器函数中没有,它会向父级寻找所以num =1;其实我们可以传递参数的。
2.第一个参数函数,第二个参数为delay时间,第三个参数为传递的参数
var num = 1;
function fn() {
var timer = setTimeout(function (num) {
console.log(num);
}, 1000,'我是传递的参数');
};
fn();//我是传递的参数
解释:因为我往定时器函数中传递了参数,所以打印出来的值是我传递的参数值。其实第一个参数可以不是函数,可以是字符串。
3.第一个参数字符串,第二个参数为delay时间(使用该语法是不推荐的, 原因和使用 eval()一样,有安全风险)
var num = 1;
function fn() {
var timer = setTimeout('console.log(num)', 1000);
};
fn();//1
解释:其实它是能解析字符串,包括字符串函数,这里不能叫函数,只是写法有点区别
var num = 1;
var string = 'function (){console.log(num)}';
function fn() {
var timer = setInterval('(' string ')' "();",1000);
};
fn();
解释:定时器里面的函数有2种写法,上面string函数(不是字符串)为例子,一种就是setInterval(string,1000);它会自己调用,还有一种就是setInterval(‘string()’,1000)
这篇好文章是转载于:学新通技术网
- 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
- 本站站名: 学新通技术网
- 本文地址: /boutique/detail/tanhfiaeaj
-
photoshop保存的图片太大微信发不了怎么办
PHP中文网 06-15 -
《学习通》视频自动暂停处理方法
HelloWorld317 07-05 -
Android 11 保存文件到外部存储,并分享文件
Luke 10-12 -
word里面弄一个表格后上面的标题会跑到下面怎么办
PHP中文网 06-20 -
photoshop扩展功能面板显示灰色怎么办
PHP中文网 06-14 -
微信公众号没有声音提示怎么办
PHP中文网 03-31 -
excel下划线不显示怎么办
PHP中文网 06-23 -
excel打印预览压线压字怎么办
PHP中文网 06-22 -
TikTok加速器哪个好免费的TK加速器推荐
TK小达人 10-01 -
怎样阻止微信小程序自动打开
PHP中文网 06-13