setInterval 传参数

本文通过一个具体的JavaScript代码示例,详细介绍了如何使用定时器(setInterval)实现每隔一段时间执行特定函数的方法。文中还展示了如何在函数中正确处理变量作用域及闭包问题。
<script type="text/javascript" >  
    window.onload=function(){  
        for(var i=1;i<3;i++){  
            var m ="i="+i;  
            setInterval(function(){test(m);},1000);  
        }  
    }  
    function test(e) {  
        console.log(e);  
    }  
</script>

转载于:https://www.cnblogs.com/wsq-blog/p/10635456.html

<think>我们正在讨论JavaScript中的setInterval函数。根据引用[2]和[3],setInterval的基本语法是:constintervalId=setInterval(callback,delay[,arg1,arg2,...]);参数详解:1.callback:必需,表示要重复执行的函数或代码字符串(但通常不推荐使用字符串,因为会调用eval,有安全风险)。2.delay:必需,表示每次执行之间的时间间隔,单位是毫秒(ms)。如果省略或为0,则会使用最小值(通常4ms,但不同浏览器可能不同)。3.arg1,arg2,...:可选,这些额外的参数将会作为参数递给callback函数。注意:delay的最小值在HTML5标准中规定为4ms,但在实际浏览器中,如果嵌套的定时器超过5层,可能会被限制为至少4ms。示例1:基本用法```javascriptsetInterval(function(){console.log('Helloeverysecond');},1000);```示例2:参数```javascriptfunctiongreet(name,message){console.log(`Hello,${name}!${message}`);}setInterval(greet,2000,'Alice','Howareyou?');//每隔2秒,输出:Hello,Alice!Howareyou?```示例3:使用箭头函数```javascriptsetInterval((name)=>{console.log(`Hi,${name}!`);},3000,'Bob');```重要事项:-setInterval会返回一个唯一的intervalID,这个ID可以用来清除定时器(使用clearInterval)。-如果callback函数执行时间超过delay时间,那么下一次执行可能会被延迟,甚至可能会连续执行而没有间隔。因此,setInterval并不保证精确的时间间隔。清除定时器:```javascriptconsttimerId=setInterval(myFunction,1000);//在某个条件满足时清除定时器clearInterval(timerId);```引用来源:[^2][^3]</think>### JavaScript `setInterval()` 方法参数详解 `setInterval()` 是 JavaScript 中用于周期性执行代码的核心函数,其完整语法为: ```javascript const intervalID = setInterval(callback, delay[, arg1, arg2, ...]); ``` #### 核心参数解析 1. **`callback`(必需)** - 要重复执行的函数或代码块 - 可以是命名函数、匿名函数或箭头函数 ```javascript // 命名函数 function myFunc() { console.log('Executed!') } setInterval(myFunc, 1000); // 匿名函数 setInterval(function() { console.log('Anonymous function'); }, 1500); // 箭头函数(ES6+) setInterval(() => console.log('Arrow function'), 2000); ``` 2. **`delay`(必需)** - 执行间隔时间(毫秒) - 最小值通常为 4ms(浏览器限制) - 设为 `0` 或省略时使用默认值(4ms) ```javascript setInterval(logTime, 500); // 每500毫秒执行一次 ``` 3. **附加参数(可选)** - 从第三个参数开始,将作为参数递给 `callback` ```javascript function greet(name, message) { console.log(`Hello ${name}! ${message}`); } // 递两个附加参数 setInterval(greet, 3000, 'Alice', 'How are you?'); ``` **输出效果**: ``` Hello Alice! How are you? // 每3秒重复输出 ``` #### 返回值特性 - 返回唯一的 `intervalID`(数值类型) - 用于通过 `clearInterval(intervalID)` 停止定时器 ```javascript const timer = setInterval(() => { if(condition) clearInterval(timer); }, 1000); ``` #### 注意事项 1. **时间精度问题** - 实际间隔可能比设定值长(受事件循环和CPU负载影响) - 最小保证间隔为 4ms[^2] 2. **内存管理** ```javascript // 错误示例:未清除的定时器会导致内存泄漏 function startTimer() { setInterval(heavyTask, 1000); } // 正确做法 let intervalId = null; function startSafeTimer() { intervalId = setInterval(lightTask, 1000); } function stopTimer() { clearInterval(intervalId); } ``` 3. **执行阻塞** - 当回调执行时间 > delay 时,会连续执行无间隔 - 解决方案:使用递归 `setTimeout()` ```javascript function recursiveCall() { // 执行任务... setTimeout(recursiveCall, 1000); } ``` #### 浏览器兼容性 - 所有现代浏览器(Chrome, Firefox, Safari, Edge)完全支持 - IE9+ 支持附加参数递[^3] - 工作线程(Web Workers)中可用[^2] > **最佳实践**:对于需要精确计时的场景(如动画),推荐使用 `requestAnimationFrame()`;普通周期性任务使用 `setInterval()` 时,务必配套清除机制[^1]。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符  | 博主筛选后可见
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值