setTimeOut传参数(转)

本文详细介绍了在JavaScript中使用setTimeout函数时遇到的问题及解决方案,包括如何在不带参数的情况下实现延时调用带有参数的函数,以及利用闭包技巧解决动态设置onclick事件和setTimeout传参问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

突然想到在一个函数中延时调用另外一个函数,在JQuery1.3.2中没有发现相应方法,在网上搜索,搜集如下,特做个完整保存: 

(1)转自: http://blog.youkuaiyun.com/nsrainbow/article/details/2370329  原文如下 

无论是window.setTimeout还是window.setInterval,在使用函数名作为调用句柄时都不能带参数。 

先看一个简单的代码: 

Javascript代码   收藏代码
  1. function show(){      
  2.     alert("Hello World");  
  3. }  
  4. setTimeout(show,1000);  


这段代码的效果是在1秒后显示hello world,但是如果改成 

setTimeOut(show(),1000); 

就会立即显示,达不到延时的效果了。但是如果加上引号就可以了。如: 

setTimeOut("show()",1000); 

就可以了。但是如果带上参数的话,还是不行比如: 

setTimeOut("show(name)",1000) 

这时就了一个比较的方法,就是再写个函数,该函数返回一个不带参数的函数,具体如下: 

Javascript代码   收藏代码
  1. <script language="javascript">  
  2.     function show(name)  
  3.     {alert("Hello World:" + name);}  
  4.   
  5.     function _show(name)  
  6.     {  
  7.         return function()  
  8.         {  
  9.             show(name);  
  10.         }  
  11.     }  
  12.     setTimeout(_show(name),1000);  
  13. </script>  


(2)转自 http://blog.youkuaiyun.com/huanglan513/article/details/5669912  原文如下 


setTimeout传参数问题,弄了很久,终于解决了,O(∩_∩)O哈! 




view plain 
Javascript代码   收藏代码
  1. function timeClick(obj)    
  2.        {    
  3.         //   var obj=document.getElementById('');    
  4.            obj.style.backgroundColor=&quot;gray&quot;;    
  5.            obj.onclick=function(){ return false;};    
  6.            setTimeout(function(){resetbgColor(obj);},3000);    
  7.        }    
  8.            
  9.        function resetbgColor(obj)    
  10.        {    
  11.          //  var obj=document.getElementById('');    
  12.            obj.style.backgroundColor=&quot;&quot;;    
  13.         //   $('#'+'').click(timeClick);    
  14.       //  debugger;    
  15.            obj.onclick=function(){    
  16.                timeClick(this);    
  17.            };    
  18.        }    


          我发现这句还真是万能啊,太服了,  function(){ method(param);}  

          这里两个地方都用到了,解决了我的所有问题,1.setTimeout传参数 2.动态设置onclick事件  

         setTimeout(function(){resetbgColor(obj);},3000);  


          obj.onclick=function(){ 
                timeClick(this); 
            };
<think>嗯,用户问的是如何在JavaScript的setTimeout参数。我需要先回顾一下setTimeout的基本用法。根据引用[1],setTimeout的语法是setTimeout(function, milliseconds),但默认情况下,直接参数可能不太直观。比如,如果直接写setTimeout(func(arg1, arg2), 1000),这样func会立即执行,而不是延迟执行。所以用户可能遇到了这个问题,想了解正确的参方法。 接下来,想到有三种方法。第一种是使用匿名函数包裹,在匿名函数内部调用目标函数并参数。这种方法简单直接,如示例中的例子。不过需要注意,如果有变量在之后被修改,可能会影响结果,这时候可能需要用闭包或者立即执行函数来保存当前值。 第二种方法是通过setTimeout的附加参数。从引用[2]中提到的MDN文档,setTimeout允许在第三个及之后的参数参数,这些参数会作为回调函数的参数。比如setTimeout(func, 1000, arg1, arg2)。但需要注意兼容性,虽然现代浏览器都支持,但老版本IE可能不支持。 第三种方法涉及更复杂的场景,比如需要递动态参数或在循环中使用。这时候可能需要结合闭包或者bind方法。例如,在循环中使用立即执行函数来捕获当前的i值,避免所有回调都引用同一个变量。或者使用bind来预设参数,如func.bind(null, arg1, arg2),这样执行时参数就固定了。 用户可能还关心异步处理和Promise的结合。根据引用[4],可以用Promise封装setTimeout,这样在.then中处理参数会更清晰。不过用户的问题主要是参,这部分可能需要扩展说明,比如在Promise内部如何参数。 还需要注意参数的本质,引用[3]提到函数的参数处理,包括剩余参数。在setTimeout的回调中,如果使用附加参数,它们会按顺序递给回调函数,可以用...rest来接收剩余参数。 最后,测试示例是否正确。比如,匿名函数包裹和附加参数方法是否真的能正确参数。可能需要提醒用户在实际使用时注意作用域和变量生存期的问题,特别是在异步上下文中变量可能已经被改变的情况。</think>### 通过`setTimeout`参数的三种方法 #### 1. 匿名函数包裹(基础方法) ```javascript setTimeout(function() { myFunction("参数1", "参数2"); }, 1000); ``` **原理**:通过创建闭包保存参数值 **注意**:若参数是动态变量,需用立即执行函数保存当前状态: ```javascript for (var i = 0; i < 5; i++) { (function(currentI) { setTimeout(function() { console.log(currentI); }, 1000); })(i); } ``` #### 2. setTimeout附加参数(ES6+推荐) ```javascript setTimeout(myFunction, 1000, "参数1", "参数2"); ``` **特性**: - 第三个参数开始为回调参数 - 兼容性:IE10+[^2] - 支持多参数递: ```javascript const data = { id: 123, name: "test" }; setTimeout((a, b, c) => { console.log(a, b, c); // 输出 10, 20, { id: 123, name: "test" } }, 1000, 10, 20, data); ``` #### 3. bind()方法绑定上下文 ```javascript const boundFunction = myFunction.bind(null, "固定参数"); setTimeout(boundFunction, 1000); ``` **优势**: - 可预设参数 - 可绑定执行上下文 - 支持柯里化: ```javascript function log(prefix, message) { console.log(`[${prefix}] ${message}`); } setTimeout(log.bind(null, "DEBUG"), 1000, "系统启动完成"); // 输出:[DEBUG] 系统启动完成 ``` ### 进阶应用:Promise封装 ```javascript function delay(milliseconds, ...args) { return new Promise(resolve => { setTimeout(resolve, milliseconds, ...args); }); } delay(1000, "输数据").then(data => { console.log("接收:", data); // 1秒后输出「接收: 输数据」 }); ``` ### 注意事项 1. **内存泄漏风险**:递DOM元素时需手动解除引用 2. **参数序列化**:对象参数会保持引用而非拷贝 3. **严格模式**:`setTimeout`回调中的`this`默认指向`window`/`global`
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值