JavaScript定时器

2019-02-18 3,442 阅读1分钟

一、定时器

setTimeout：循环一次。
setInterval：循环多次。
clearTimeout：清除一次性定时器。
clearInterval：清除多次定时器。

function boom(){
    console.log('boom');
}
setTimeout(boom, 1000); //1秒后执行代码

function go(){
    console.log('起床了')
}
setInterval(go, 3000); //每隔3秒不断执行代码

//执行一个循环定时器，并将返回值赋给timer这个变量
var timer = setInterval(function(){
    console.log('2');
},1000);
console.log(timer);
//取消定时器需要有索引值，timer保存的是动画队列里的索引值(key) ，clearInterval停止动画需要一个索引值
clearInterval(timer);

二、回调函数

function test(d){
    var a = 1;
    var b = a +1;
    var c = b;
    //传进来的是个函数 ，所以能加括号执行 最后把处理的结果传给d,这个函数d被称作回调函数
    d(a,b,c);
}

//将函数作为参数传递
test(function(a,b,c){
    console.log(a,b,c)
})

三、同步代码和异步代码

同步代码：前面的代码没有执行完，会阻塞后面的代码执行。
异步代码：等满足条件的时间去执行。
异步加载： 1）定时器，动画帧 2）事件绑定的内容 3）Ajax采用的也是异步操作 4）回调函数

//发现时间大概在2毫秒左右，因为先执行同步代码for循环，再去执行定时器。
console.time();

setTimeout(function(){
    console.timeEnd();
},0);

for(var i = 0 ;i < 10000;i++){
    for(var j = 0;j< 10000;j++){
        Math.random();
    }
}