JavaScript计时器的用法setTimeout（）和setInterval()

Javascript计时器的用法

当我们学习前端的时候定时器是一个重要的知识点，几乎现在的我们打开一个网页中的页面都会看见定时器的身影，京东淘宝的定时秒，轮播图、规定时间的界面跳转…

在JavaScript中给我们提供了两种定时器setTimeout（）和setInterval()

一、setTimeout（）定时器

语法：window.setTimeout(调用函数，[延迟的毫秒数)；

setTimeout()方法：在指定的毫秒数后执行调用函数
注意：
1、因为setTimeout方法是属于window对象的所以我们在调用的时候可以不用写window可以直接写setTimeout(调用函数，[延迟的毫秒数)；
2、延迟的时间单位是毫秒，但是可以省略，如果神略则默认的是0，立即执行

  （1）setTimeout(function(){
      console.log('时间到了');
   }
  （2）setTimeout(function(){
      console.log('时间到了');
    }，0)
    
这两个的定时器的意义是一样的 

3、调用的函数可以直接写函数、可以写函数名、还有字符串的写法’函数名()’

(1)直接写函数

  setTimeout(function(){
      console.log('时间到了');
    }，1000)

(2)写函数名

		首先定义一个函数
			function alarm（）
				{console.log('时间到了');}
			setTimeout（alarm，1000）；
	当一秒过后触发alarm函

（3）字符串的写法’函数名()’

		首先定义一个函数
			function alarm（）
				{console.log('时间到了');}
			setTimeout（'alarm()'，1000）；
		当一秒过后触发alarm函数

4、当我们页面存在多个定时器的时候，我们经常要给定时器加标识符,防止定时器在计数的时候出现混乱

	  Var time1 = setTimeout(function(){
	      console.log('时间到了');
	    }，1000)
	    
	  Var time2 = setTimeout(function(){
	      console.log('时间到了');
	    }，1000);

二、setInterval（）定时器

语法：window.setInterval(调用函数，[延迟的毫秒数)；

setInterval()方法：在指定的毫秒数后执行调用函数
注意：
1、因为setTimeout方法是属于window对象的所以我们在调用的时候可以不用写window可以直接写setInterval(调用函数，[延迟的毫秒数)；
2、延迟的时间单位是毫秒，但是可以省略，如果神略则默认的是0，立即执行

  （1）setInterval(function(){
      console.log('时间到了');
   }
  （2）setInterval(function(){
      console.log('时间到了');
    }，0)
    
这两个的定时器的意义是一样的 

3、调用的函数可以直接写函数、可以写函数名、还有字符串的写法’函数名()’

(1)直接写函数

 setInterval(function(){
      console.log('时间到了');
    }，1000)

(2)写函数名

		首先定义一个函数
			function alarm（）
				{console.log('时间到了');}
			setInterval（alarm，1000）；
	每隔一秒过后触发alarm函

（3）字符串的写法’函数名()’

		首先定义一个函数
			function alarm（）
				{console.log('时间到了');}
			setInterval（'alarm()'，1000）；
		每隔一秒过后触发alarm函数

4、当我们页面存在多个定时器的时候，我们经常要给定时器加标识符,防止定时器在计数的时候出现混乱

	  Var time1 = setInterval(function(){
	      console.log('时间到了');
	    }，1000)
	    
	  Var time2 = setInterval(function(){
	      console.log('时间到了');
	    }，1000);

三、两者的区别

1、window.setTimeout（）函数 定时时间到了，就去调用这个函数，只调用一次，当函数调用完成后就结束了这个定时器
2、window.setInterval();函数 每隔这个定时的时间，就去掉用这个函数，会多次调用重复调用这个函数

四、清除定时器

有时候我们会让定时器去除这时候我们应该怎么去除掉定时器呢？

(1)清除window.setTimeout()定时器用window.clearTimeout（定时器的标识符）

 Var time1 = setTimeout(function(){
	      console.log('时间到了');
	    }，1000)
	    
clearTimeout(time1);

(2)清除window.setInterval()定时器用window.clearInterval（定时器的标识符）

	Var time1 = setInterval(function(){
	      console.log('时间到了');
	    }，1000)
	    
	clearInterval(time1);