setTimeout和setInterval的用法

由于我的js没有正规学习过，所以码东西的时候总会有一些新发现，这两天写弹幕播放器的时候我又发现了定时函数的新用法，于是来记录一下。

一开始我从w3school学习了setTimeout的基本用法，他的例子是这样的

<html>
<head>
<script type="text/javascript">
function timedMsg()
 {
 var t=setTimeout("alert('5 seconds!')",5000)
 }
</script>
</head>

<body>
<form>
<input type="button" value="Display timed alertbox!" onClick="timedMsg()">
</form>
</body>
</html>

于是我后来就一直用引号围起要定时运行的内容。。。。。

但是后来就出现了一个问题，就是引号围起的内容不属于window对象的话，就会报错，这样用引号我就没法运行当前对象中的内容了。

后来我知道了闭包，这时候我学会了用一个匿名函数传递给setTimeout来运行

setTimeout(function(){
	console.log("喵");
}
,250);

这样就可以调用当前环境的任何内容了，可是还有一个问题，~~就是如果要运行很多次这个timeout的话，就要创建很多次这个function，结束以后还要被销毁~~（更正，正常的js引擎中不会出现这种情况），既然这个function内容是不变的，那干脆就写在外面好了,于是就成了这个样子

function miao(){
	console.log("喵");
}
setTimeout(miao,250);

函数被写到了外面，然后把函数传递给setTimeout，到时间它就会去调用这个函数。

然后这个写法我就沿用了很长时间，直到我发现我需要给定时执行的函数传递参数的时候却不知道该怎么写，因为这么写是不行的

function miao(t){
	console.log(t);
}
setTimeout(miao(t),250);//错

所以我只好这么写

function miao(t){
	console.log(t);
}
setTimeout(function(){
	miao("喵");
},250);

这样唯一的好处就是如果被调用函数很巨大的话用不着每次都创建它，不过这里还是用到匿名函数了。

后来我又知道了原来这两个定时函数可以有很多个参数，第三个参数开始其实就是传递给被调用函数的参数。

function a(q,w,e,r,t){
	console.log(q,w,e,r,t);
}
setTimeout(a,0,1,2,3,4,5);

//控制台输出：
// 1 2 3 4 5

以上内容setInterval同理。

新技能get√

本文发布于 https://luojia.me

本站文章未经文下加注授权不得拷贝发布。