面试的时候被问到这个题,然后没能解答出来,回去想了想,想出来了一种方案。
一、首先来看看怎么实现setInterval 的:
var mySetInterval= function(fn, time) {
// 定义一个递归函数,持续调用定时器
var execute = function(fn, time) {
setTimeout(function(){
fn();
execute(fn, time);
}, time)
}
execute(fn, time);
}
我们来调用一下:
var set1 = mySetInterval(function() {
console.log(1);
}, 3000)
控制台
二、那么如果我们如何实现clearInterval 呢?
首先,我们先来研究一下setTimeout :
setTimeout 返回的竟然是一串整数,并且这些整数都不重复,还是连续的,没错,这个就是clearTimeout 工作的时候,会找到对应的id的定时器,然后清除掉,好了,知道了这个,那么我们能不能把当前定义的mySetInterval 的id存储下来呢?
var timeWorker = {}
var mySetInterval= function(fn, time) {
// 定义一个key,来标识此定时器
var key = Symbol();
// 定义一个递归函数,持续调用定时器
var execute = function(fn, time) {
timeWorker[key] = setTimeout(function(){
fn();
execute(fn, time);
}, time)
}
execute(fn, time);
// 返回key
return key;
}
var myClearInterval = function(key) {
if (key in timeWorker) {
clearTimeout(timeWorker[key]);
delete timeWorker[key];
}
}
来看一下执行结果:
成功!