zoukankan      html  css  js  c++  java
  • 函数防抖

    在前端开发的过程中,我们经常会需要绑定一些持续触发的事件,如 resize、scroll、mousemove 等等,但有些时候我们并不希望在事件持续触发的过程中那么频繁地去执行函数。通常这种情况下我们怎么去解决的呢?一般来讲,防抖是比较好的解决方案。

    /**
     * 函数防抖
     * @param {*} func 函数
     * @param {*} wait 延迟执行毫秒数
     * @param {*} immediate true 表立即执行,false 表非立即执行
     */ 
    let debounce = (func,wait,immediate) => {
        let timeout;
    
        return function () {
            let context = this;
            let args = arguments;
    
            if (timeout) clearTimeout(timeout);
            if (immediate) {
                var callNow = !timeout;
                timeout = setTimeout(() => {
                    timeout = null;
                }, wait)
                if (callNow) func.apply(context, args)
            }
            else {
                timeout = setTimeout(function(){
                    func.apply(context, args)
                }, wait);
            }
        }
    }
    
    
    // 调用
    $(".box").on('mousemove', throttle(debounce, 1000, true))
  • 相关阅读:
    清除浮动解决父元素高度塌陷问题
    canvas画动图
    vue实现列表的循环滚动
    localStorage读写操作
    angularJS快速入门
    python模块
    python函数式编程
    python高级特性
    Flask 快速入门
    JQuery Ajax
  • 原文地址:https://www.cnblogs.com/xulinjun/p/11962642.html
Copyright © 2011-2022 走看看