本文为大家讲解的是setInterval()和setTimeout()的两种使用方式及作用域和区别，感兴趣的同学参考下。 setInterval()是以指定的时间为周期调用函数的方法
本文为大家讲解的是setInterval()和setTimeout()的两种使用方式及作用域和区别，感兴趣的同学参考下。
setInterval()是以指定的时间为周期调用函数的方法。
setTimeout()是延时指定的时间来执行某个函数的方法。
两个函数虽然作用不同，但传参方式和作用域是相同的，下面来具体分析一下。
以setInterval()为例：
第一个参数是用来传递要调用的方法，可以传递一个代码串，如下：
1 <script>
2 function fn(value){
3 alert("value=" + value);
4 }
5 setTimeout("fn(1)", 1000);
6 </script>
但是当在一个闭包里调用的时候，就会出现问题，如：
1 <script>
2 function outerFn(){
3 var value = 1;
4 function fn(){
5 alert("value=" + value);
6 value += 1;
7 }
8 setInterval("fn()", 3000);
9 }
10 outerFn();
11 </script>
会出现错误：Uncaught ReferenceError: fn is not defined
原因是fn()是以字符串的方式传递的，它的作用域是全局作用域，全局作用域是无法访问到fn()的。
解决的办法是fn以函数引用的方式传递，也就是setInterval()的第二种传参方式。
1 <script>
2 function outerFn(){
3 var value = 1;
4 function fn(){
5 alert("value=" + value);
6 value += 1;
7 }
8 setInterval(fn, 3000);
9 }
10 outerFn();
11 </script>
但是这样又带来问题，如果想给fn传参数怎么办？可以像如下这样去写吗？
1 <script>
2 function outerFn(){
3 var value = 1;
4 function fn(n){
5 alert("value=" + n);
6 }
7 setTimeout(fn(5), 1000);
8 }
9 outerFn();
10 </script>
答案是不可以的，函数只写函数名，是函数引用；后面加括号是函数执行。
1 setTimeout(fn, 1000); //fn的引用 2 setTimeout(fn(5), 1000); //fn直接执行
所以第7行，没有按照预期延迟1000毫秒执行fn(5)，而是立刻就执行了。这要注意和上面第一种方式——传递代码字符串的不同。
如果确实有从外部传参的需要，该怎么办呢？
1 <script>
2 function outerFn(value){
3 function fn(){
4 alert("value=" + value);
5 }
6 setTimeout(fn, 1000);
7 }
8 outerFn(5);
9 </script>
如上，是利用了闭包的原理，fn作为内部函数，是可以访问包含它的outerFn的作用域中的变量的，因此我们想给fn传参，只要给outerFn传参就可以了。这在传递的参数复杂（比如是一个复杂的json）的情况下，很有用途。
标签: setInterval setTimeout 两种 使用 方式 作用域
声明：本文内容来源自网络，文字、图片等素材版权属于原作者，平台转载素材出于传递更多信息，文章内容仅供参考与学习，切勿作为商业目的使用。如果侵害了您的合法权益，请您及时与我们联系，我们会在第一时间进行处理！我们尊重版权，也致力于保护版权，站搜网感谢您的分享！
