js防抖立即执行和非立即执行的理解

立即执行：即多次触发事件，第一次会立即执行函数，之后在设定wait事件内触犯的事件无效，不会执行。

非立即执行函数：多次触发事件，只会在最后一次触发事件后等待设定的wait时间结束时执行一次。

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body></body>
<script>/**
* @desc 函数防抖---“立即执行版本” 和 “非立即执行版本” 的组合版本
* @param func 需要执行的函数
* @param wait 延迟执行时间（毫秒）
* @param immediate---true 表立即执行，false 表非立即执行
**/function debounce(func, wait, immediate) {let timer;return function () {//this指向debouncelet context = this;//即参数，func,waitlet args = arguments;//如果timer不为null, 清除定时器if (timer) clearTimeout(timer);//如果是立即执行if (immediate) {//定义callNow = !timervar callNow = !timer;//定义wait时间后把timer变为null//即在wait时间之后事件才会有效timer = setTimeout(() => {timer = null;}, wait)//如果callNow为true,即原本timer为null//那么执行func函数if (callNow) func.apply(context, args)} else {//如果是不立即执行//那就是每次重新定时timer = setTimeout(function () {func.apply(context, args)}, wait);}}}function handle() {console.log(Math.random());}window.addEventListener("mousemove",debounce(handle,1000,true)); // 调用立即执行版本// window.addEventListener("mousemove", debounce(handle, 1000, false)); // 调用非立即执行版本
</script></html>

js防抖立即执行和非立即执行的理解相关推荐

js代码-防抖函数（立即执行和非立即执行）
防抖即执行function debounce(fn, delay) {let timeid=null, flag = true;return function () {clearTimeout(ti ...
lisp如何调用linux头文件,Lisp之程序的交互执行和非交互执行
学习Lisp也有一段时间了,基本在打基础,学习基本的语法,但是一直也没写个程序玩玩,当然了Helloworld 这种程序是不算了.今天写了个稍复杂的程序,运行了下,感觉不错. 我在我的Ubuntu上装 ...
js防抖、节流（立即执行/非立即执行 + 立即取消等待）
文章目录一.防抖(立即执行/非立即执行 + 立即取消等待) 1.1 非立即执行版 1.2 立即执行版 1.3 合并版 1.4 合并版 + 立即取消等待二.节流(立即执行/非立即执行 + 立即取消等 ...
学JS的心路历程 -非同步执行
JS是单线程的语言,也就是说同一时间只会执行一行程序,所以如果一段程序执行过久就会造成阻塞(blocking)的现象,必须等到它结束后才能执行下一段程序. 举个例子来说,如果我们今天要买便当,但是老板 ...
防抖和节流函数详解（立即执行/非立即执行）
在线查看效果移动鼠标触发 1.防抖(立即执行/非立即执行) 什么是防抖:一个事件在触发后,设置定时器,若n秒内该事件没有再次发生,那么执行这个函数,如果n秒内该事件再次发生了,那么定时器重新开始计时. ...
php proc open 返回,PHP用proc_open新建子进程使用管道通信非阻塞执行PHP脚本
PHP用proc_open新建子进程使用管道通信非阻塞执行PHP脚本. 脚本结束时register_shutdown_function回调函数访问管道获取子进程输出的数据. 例子1(popen): f ...
shell sqlplus执行sql文_各主流数据库非交互执行
声明: 文章初衷仅为攻防研究学习交流之用,严禁利用相关技术去从事一切未经合法授权的入侵攻击破坏活动,因此所产生的一切不良后果与本文作者及该公众号无任何关联另外,这只是一个个人性质的公众号 ...
iOS NSOperation 非并发执行
NSOperation提供了一种面向对象的方法来封装任务.NSOperation可以单独执行,也可以放到NSOperationQueue中执行. NSOperation是虚基类不能直接使用,但Coco ...
int.TryParse非预期执行引发的思考 ASP.NET -- WebForm -- 给图片添加水印标记 Windows -- 使用批处理文件.bat删除旧文件...
int.TryParse非预期执行引发的思考问题出现这天在写一个页面,想谨慎些就用了int.TryParse,结果出问题了. 代码如下: Copy int id = 1000; //Request ...

js防抖立即执行和非立即执行的理解

js防抖立即执行和非立即执行的理解相关推荐

最新文章

热门文章