建设 银行网网站,wordpress 4.7.11搬家,网站首页版式,电子商务网站建设策划报告防抖(debounce)#xff1a;定义一个时间#xff0c;延迟n秒执行#xff0c;n秒内再次调用#xff0c;会重新计时#xff0c;计时结束后才会再次执行
主要运用场景#xff1a;
输入框实时搜索#xff1a;在用户输入内容的过程中#xff0c;使用防抖可以减少频繁的查询…防抖(debounce)定义一个时间延迟n秒执行n秒内再次调用会重新计时计时结束后才会再次执行
主要运用场景
输入框实时搜索在用户输入内容的过程中使用防抖可以减少频繁的查询操作提高性能。点击事件当用户在短时间内多次点击某个按钮时可以使用防抖只执行一次点击事件避免不必要的重复操作。
函数封装 util文件下创建 commo.js文件
let timer/**
*防抖
*/export function debounce(fn,delay){clearTimeout(timer)timer setTimeout((){fn();},delay);
}
引入调用
//引入防抖函数
import {debounce} from util/common.js//调用
debounce((){//需要防抖执行的逻辑
},800)
节流(throttle): 函数会在一个时间段内只执行一次
主要运用场景登陆、频繁请求大量数据接口
函数封装 util文件下创建 commo.js文件
let lastCall 0/**
*节流函数
*/export function throttle(fn,delay){const now new Date().getTime();if(now-lastCalldelay){return}lastCall nowfn.apply(this,arguments)}
引入调用
//引入防抖函数
import {throttle} from util/common.js//调用
throttle((){//需要节流执行的逻辑
},800)
