您的位置:首页 > Web前端 > JavaScript

JavaScript中setTimeout和setInterval函数的传参及调用

2016-03-11 00:00 991 查看
如何向 setTimeout 、 setInterval 传递参数

看如下代码:

var str = 'aaa'; 
var num = 2; 
function auto(num){ 
  alert(num); 
} 
setTimeout('auto(num)',4000);


这样写是可以正常工作的,但是如其说这是参数传递,还不如说是直接使用的全局变量。所以,这种写法是没有必要的,一般情况下更多的是用到传递局部变量作为参数。

把代码修改一下:

//var str = 'aaa'; 
var num = 2; 
function test(){ 
  var str = 'bbb'; 
  setTimeout('auto(str)',4000); 
} 
function auto(a){ 
  alert(a); 
} 
test();


这种写法会报错,如果把取消对 str 的全局声明的注释,就会输出 aaa,即函数依然是调用全局变量。

看下面的代码:

//var str = 'aaa'; 
var num = 2; 
function test(){ 
  var str = 'bbb'; 
  setTimeout('auto("str")',4000); 
} 
function auto(a){ 
  alert(a); 
} 
test();


注意上面的 str ,这样写会输出 “str”,也就是说定时器调用函数后,是把 str 直接当作了参数。这样传递的参数永远是字符串。这不是我们想要的结果。

要想传递除字符串意外的参数,可以使用闭包,看下面代码:

//var str = 'aaa'; 
var num = 2; 
function test(){ 
  var str = 'bbb'; 
  setTimeout(auto(str),4000); 
} 
function auto(str){ 
  return function(){ 
    alert(str); 
  } 
} 
test();


输出结果为 ‘bbb',如果给auto(str)加上引号同样会报错。

当然,这样写也是不错的:

var num = 2; 
function test(){ 
  var str = 'bbb'; 
  //setTimeout(auto(str),4000); 
  setTimeout(function(){alert(str)},4000); 
} 
function auto(str){ 
  return function(){ 
    alert(str); 
  } 
} 
test();


最后需要注意的是,字不使用闭包传递参数时,定时器调用的函数是要加引号的,不加引号,会报错。以上情形同样适合 setInterval();

setTimeout 、 setInterval 中的函数调用

有如下代码:

var num = 2; 
function auto(){ 
  alert(num); 
} 
setTimeout(auto(),4000);


在这段程序里,测试的时候立刻就可以看到弹出的警告框。也就是说按照以上方法引用函数,定时器是不起作用的。

同样,对于setInterval上面的写法也不能正常工作,程序只能弹出一次警告框,然后报错。

把定时器改为

setInterval('auto()',4000); 
setTimeout('auto()',4000);


程序可以正常工作。

当不使用auto()调用函数,只使用 auto会是什么样呢?

var str = 'aaa'; 
var num = 2; 
function auto(){ 
  alert(num); 
} 
//setInterval(auto,4000); 
setTimeout(auto,4000);


这样写程序都可以正常工作;

如果给auto加上引号

//setInterval('auto',4000); 
setTimeout('auto',4000);


都不能正常工作。

您可能感兴趣的文章:

理解javascript定时器中的setTimeout与setInterval
JavaScript中SetInterval与setTimeout的用法详解
javascript中SetInterval与setTimeout的定时器用法
浅谈JavaScript中setInterval和setTimeout的使用问题
Javascript中setTimeOut和setInterval的定时器用法
JavaScript中停止执行setInterval和setTimeout事件的方法
js超时调用setTimeout和间歇调用setInterval实例分析
javascript中setTimeout和setInterval的unref()和ref()用法示例
JavaScript SetInterval与setTimeout使用方法详解
JS中setInterval、setTimeout不能传递带参数的函数的解决方案
Js中setTimeout()和setInterval() 何时被调用执行的用法
Js setInterval与setTimeout(定时执行与循环执行)的代码(可以传入参数)
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: