首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

setTimeout(fn(),delay)没有按预期延迟

在JavaScript中,setTimeout函数用于在指定的延迟时间后执行一个函数。在这个问题中,setTimeout(fn(), delay)没有按预期延迟,可能是因为函数fn()setTimeout中被立即执行。

正确的使用方法是将函数fn作为参数传递给setTimeout,而不是调用它。这样,fn将在延迟时间后被执行。

正确的用法如下:

代码语言:javascript
复制
setTimeout(fn, delay);

在这个问题中,setTimeout(fn(), delay)中的fn()函数会在setTimeout执行时立即执行,导致没有延迟。为了解决这个问题,请确保将函数fn作为参数传递给setTimeout,而不是调用它。

例如:

代码语言:javascript
复制
function fn() {
  console.log("Hello, World!");
}

setTimeout(fn, 1000); // 在1秒后执行fn()函数

这样,fn()函数将在指定的延迟时间后执行,而不是在setTimeout执行时立即执行。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

setTimeout实现原理和使用注意

setTimeout用法 var timeoutID = setTimeout(function[, delay, arg1, arg2, ...]); var timeoutID = setTimeout...(function[, delay]); var timeoutID = setTimeout(code[, delay]); 第一个参数为函数或可执行的字符串(比如alert('test'),此法不建议使用...注意事项 如果当前任务执行时间过久,会延迟到期定时器任务的执行 在使用 setTimeout 的时候,有很多因素会导致回调函数执行比设定的预期值要久,其中一个就是上文说到的,如果处理的当前任务耗时过长,...在 setTimeout 中,入参是MyObj.showName,这里是把这个值传了进去,可以理解为: const fn = MyObj.showName setTimeout(fn,1000) 这样看...但如果将延时值修改为小于 2147483647 毫秒的某个值,那么执行时就没有问题了。 参考资料 极客时间《浏览器工作原理与实践》

1.7K10
  • JavaScript设置定时器、取消定时器及执行机制解析

    另外,多个定时器如不及时清除(clearTimeout()),会造成干扰,使延迟时间更加捉摸不透。所以,不管定时器有没有执行完,要及时清除不需要的定时器。...下面来介绍几个常用的 JavaScript 定时器: setTimeout() 设置一个定时器,在定时器到期后执行一次函数或代码段:setTimeout(fn, x) 表示延迟 x 毫秒之后执行 fn...延迟时间,没有默认值 setInterval 的实现机制跟 setTimeout 类似,只不过是重复执行的。...事实上,setInterval 并不管上一次 fn 的执行结果,而是每隔 100ms 就将 fn 放入主线程队列,而两次 fn 之间具体间隔多久就不一定了,跟 setTimeout 实际延迟时间类似,和...imitateInterval(fn ,delay);         }     }, delay); } imitateInterval(callback, delay); intervalId

    4.9K10

    setTimeout不准时,CSS精准实现计时器功能

    setTimeout 不准时 有很多因素会导致 setTimeout 的回调函数执行比设定的预期值更久。...function cb() { setTimeout(cb, 0) } setTimeout(cb, 0) 未被激活的 tabs 的定时最小延迟>=1000ms 为了优化 tab 的加载损耗(以及降低耗电量...超时延迟 除了"最小延时"之外,定时器仍然有可能因为当前页面(或者操作系统/浏览器本身)被其他任务占用导致延时。...这就会导致如果一个延时 (delay) 大于 2147483647 毫秒 (大约 24.8 天) 时就会溢出,导致定时器将会被立即执行。...-- setTimeout/setInterval delay数值过大问题 打破 4ms 的限制 如果想在浏览器中实现 0ms 延时的定时器,可以尝试下述方法 (function() { var timeouts

    67610

    TypeScript延迟执行工具类

    TypeScript延迟执行工具类 在前端开发中,我们经常需要处理一些延迟执行、防抖和节流的场景。今天介绍一个实用的Delay工具类,它提供了这些常用的延迟执行功能。...0、完整代码 /** * 延迟执行工具类 */ export class Delay { /** * 延迟指定时间 * @param ms 延迟的毫秒数 * @...(resolve, ms)); } /** * 延迟执行函数 * @param fn 要执行的函数 * @param ms 延迟的毫秒数 * @...基础延迟执行 sleep方法 sleep方法提供了一个简单的延迟执行功能: // 延迟2秒 await Delay.sleep(2000); console.log('2秒后执行'); // 在async...典型场景包括: 搜索框输入 窗口调整 按钮点击 实现原理 每次触发时都会清除之前的定时器,重新设置一个新的定时器,确保只有在指定时间内没有新的触发时才执行函数。

    10100

    你不知道的setTimeout

    '); // 1s后打印出 setTimeout, 可以看到调用模式如下: let timer = setTimout(fn, delay, params) 参数:fn 为要执行的函数或者代码段, delay...是延迟执行的时间,单位为ms,其余的参数是要传入fn 中使用的值,也可没有; 返回值: 一个正整数,表示定时器编号;可以使用clearTimout(timer) 取消设定的定时器 setTimout...(fn, 0)执行时机 我们先看这样一段代码 setTimeout(() => { console.log('setTimeout') }, 0); console.log('main script...尽管setTimeout 以0ms的延迟来调用函数,但这个任务已经被放入了队列中并且等待下一次执行;并不是立即执行;队列中的等待函数被调用之前,当前代码必须全部运行完毕。...具体实现如下: const debounce = function(fn, delay) { let timer; let context; return function(){ context

    28530

    Javascript 面试中经常被问到的三个问题!

    但是如果用户可以输入的条目数量没有限制,那么你应该使用一个更高效的解决方案。...如果在面试中讨论构建应用程序,出现滚动、窗口大小调整或按下键等事件请务必提及 防抖(Debouncing) 和 函数节流(Throttling)来提升页面速度和性能。...现在一起实现一个 debounce: // fn是我们需要包装的事件回调, delay是每次推迟执行的等待时间 function debounce(fn, delay) { // 定时器 let...试想,如果用户的操作十分频繁——他每次都不等 debounce 设置的 delay 时间结束就进行下一次操作,于是每次 debounce 都为该用户重新生成定时器,回调函数被延迟了不计其数次。...这个 throttle 与 debounce “合体”思路,已经被很多成熟的前端库应用到了它们的加强版 throttle 函数的实现中: // fn是我们需要包装的事件回调, delay是时间间隔的阈值

    87320

    常见的三个 JS 面试题

    但是如果用户可以输入的条目数量没有限制,那么你应该使用一个更高效的解决方案。...如果在面试中讨论构建应用程序,出现滚动、窗口大小调整或按下键等事件请务必提及 防抖(Debouncing) 和 函数节流(Throttling)来提升页面速度和性能。...现在一起实现一个 debounce: // fn是我们需要包装的事件回调, delay是每次推迟执行的等待时间 function debounce(fn, delay) { // 定时器 let...试想,如果用户的操作十分频繁——他每次都不等 debounce 设置的 delay 时间结束就进行下一次操作,于是每次 debounce 都为该用户重新生成定时器,回调函数被延迟了不计其数次。...这个 throttle 与 debounce “合体”思路,已经被很多成熟的前端库应用到了它们的加强版 throttle 函数的实现中: // fn是我们需要包装的事件回调, delay是时间间隔的阈值

    1.3K20

    《你不知道的JavaScript》:闭包与局部作用域

    出现这样非预期的情况,原因如下: js是单线程,只有同步代码执行完毕后,才会去执行异步代码。...由于setTimeout是异步的,所以每次for循环时js都会挂起setTimeout这个异步任务,等到for循环这个同步任务执行完毕时,系统才会执行异步的任务队列,即执行setTimeout的回调函数...}, j*1000) })(i) } 完美,此时就能顺利的达到预期设想了:每秒一次的输出数字1~5。...先执行同步操作,即执行每个for循环,并将for循环出来的每个i值传入foo自执行函数中,foo自执行函数形成一个局部作用域,循环多少次就有多少个foo自执行函数局部作用域,每个局部作用域中的 i 值按循环顺序排列...想到块作用域,ES6中的let关键字不是可以主动生成块作用域的么,把上例改一下,可以更简便的实现预期设想: for(let i=1; i<=5; i++){ setTimeout(function

    52720

    js中的防抖和节流

    二、理解: 1、防抖(debounce) 本质:函数在特定的时间内不再被调用后执行 原理:设置一个定时器,如果在设定的时间间隔内事件再次触发,就会清除上一次的定时器并重新设置和计时,直到指定时间间隔内没有再次触发...); } timer = setTimeout(fn, delay) } } window.onscroll=debounce(showTop,200) 2、节流(throttle...valid){ return false } valid = false; setTimeout(() => { fn(); valid...= true; }, delay) } } 请注意,节流函数并不止上面这种实现方案,例如可以完全不借助setTimeout,可以把状态位换成时间戳,然后利用时间戳差值是否大于指定间隔时间来做判定...也可以直接将setTimeout的返回的标记当做判断条件判断当前定时器是否存在,如果存在表示还在冷却,并且在执行fn之后消除定时器表示激活,原理都一样 三、总结 总结: 函数防抖:将多次操作合并为一次操作进行

    1.6K20
    领券