debounce防抖

最新推荐文章于 2024-08-15 10:03:48 发布

汐墨颜

最新推荐文章于 2024-08-15 10:03:48 发布

阅读量373

点赞数

分类专栏： javascript 文章标签： js

本文链接：https://blog.csdn.net/qq_42345758/article/details/90720677

版权

javascript 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

首先是为什么防抖，当我们持续反复触发时间的时候，会加重浏览器的负担，用户体验会很少

所以我们可以采用debounce(防抖)和throttle(节流)来减少频繁使用的频率但是不影响功能

function debounce(self, func, immediate) {
    return function() {
        var context = self;
        var args = arguments;
        if (self.timeout) clearTimeout(self.timeout);
        if (immediate) {
            //如果已经执行过，不在执行
            var callNow = !self.timeout;
            self.timeout = setTimeout(function() {
                self.timeout = null
            }, 500)
            if (callNow) func.apply(context, args)
        } else {
            self.timeout = setTimeout(function() {
                func.apply(context, args)
            }, 500)
        }
    }
}
//调用方法
//@click="debounce(self,sumbitCustomerMessage,'immediate')()"
//self 记得在data里面声明等于this

当然我这个是在vue里面用的，所以使用方法不一样，如果你们不是那么你们需要改变一下调用方式