/**
 * 节流函数
 */
var count = 1;
var container = document.getElementById('container');
function getUserAction(e) {
    // console.log(this)
    // console.log(e);
    container.innerHTML = count++;
}
function throttle(func, wait) {
    var context, args;
    var timeout;
    var previout = 0;
    return function() {
        context = this;
        args = arguments; // 可以拿到事件处理函数的 enent对象
        if(!timeout) {
            timeout = setTimeout( () => {
                timeout = null;
                func.apply(context, args)
            }, wait)
        }
    }
}
container.onmousemove = throttle(getUserAction, 2000, true);

js-防抖(简易版)的更多相关文章

  1. js实现简易版validate

    需求分析 项目中需要根据选择不同的类型,显示不同的表单,采用的方法是css隐藏显示不需要的表单,但是这个表单字段都是必填的,尝试把不同的表单放在不同的form里,提交时根据不同的类型调用miniui自 ...

  2. Javascript基础示例:用JS写简易版贪吃蛇(面向对象)

    废话不多说,代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  3. 来,我们手写一个简易版的mock.js吧(模拟fetch && Ajax请求)

    预期的mock的使用方式 首先我们从使用的角度出发,思考编码过程 M1. 通过配置文件配置url和response M2. 自动检测环境为开发环境时启动Mock.js M3. mock代码能直接覆盖g ...

  4. 实现简易版德州扑克|学习麻瓜编程以项目为导向入门前端 HTML+CSS+JS

    实现简易版德州扑克 1.先上达到网页效果图(简易版德州扑克) 网页分为发牌区和牌池,上面为发牌区,下面是牌池区 2. 代码实现 2.1 HTML和JS代码 ` <link rel="s ...

  5. 使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包

    使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包 前端监控,埋点,数据收集,性能监控 Beacon API https://caniuse.com/beacon 优点,请 ...

  6. 使用 js 实现一个简易版的模版引擎

    使用 js 实现一个简易版的模版引擎 regex (function test() { this.str = str; })( window.Test = ...; format() { let ar ...

  7. 使用 js 实现一个简易版的 drag & drop 库

    使用 js 实现一个简易版的 drag & drop 库 具有挑战性的前端面试题 H5 DnD js refs https://www.infoq.cn/article/0NUjpxGrqRX ...

  8. 使用 js 实现一个简易版的动画库

    使用 js 实现一个简易版的动画库 具有挑战性的前端面试题 animation css refs https://www.infoq.cn/article/0NUjpxGrqRX6Ss01BLLE x ...

  9. 使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序

    使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序 具有挑战性的前端面试题 API JAMstack refs https://www.infoq.cn/article/0NUjpx ...

  10. 使用 js 实现一个简易版的 async 库

    使用 js 实现一个简易版的 async 库 具有挑战性的前端面试题 series & parallel 串行,并行 refs https://www.infoq.cn/article/0NU ...

随机推荐

  1. 行为型模式 - 迭代器模式iterator

    模式的定义与特点 迭代器模式(iterator Pattern),为的提是可以顺序访问一个聚集中的元素而不必暴露聚集的内部表象.多个对象聚在一起形成的总体称之为聚集,聚集对象是能够包容一组对象的容器对 ...

  2. Spring 01 统一资源加载策略 Resource和ResourceLoader

    转:https://www.cnblogs.com/loveLands/articles/10797772.html 1 Resource统一资源 1.1 简介 处理外部资源是很繁琐的事情,我们可能需 ...

  3. Google Guice 用户指南 - Ⅰ:概览

    译者:kefate 原文:https://github.com/google/guice/wiki/Overview 大家好,我是kefate.今天开始我将会把Google Guice的官方文档陆续翻 ...

  4. P25_wxss - rpx单位

    模板样式 - rpx 什么是 rpx 尺寸单位 rpx(responsive pixel)是微信小程序独有的,用来解决屏适配的尺寸单位. rpx 的实现原理 rpx 的实现原理非常简单:鉴于不同设备屏 ...

  5. 软件设计原则(Principles)

    设计模式的从许多优秀的软件中总结出来的 , 使用设计模式能够实现可复用.可维护.开发人员之间方便沟通设计和理解代码. Tips 对于模式的使用 , 不能拘泥于格式 , 事实上根据需要模式是可以演化的 ...

  6. OPTIRRA研究: TNF拮抗剂维持期优化减量方案[EULAR2015_SAT0150]

    OPTIRRA研究: TNF拮抗剂维持期优化减量方案   SAT0150 OPTIMISING TREATMENT WITH TNF INHIBITORS IN RHEUMATOID ARTHRITI ...

  7. JS获取本周、本月、本季度、本年

    ---------------------------------------------------------------------------------------------------- ...

  8. 自己动手从零写桌面操作系统GrapeOS系列教程——6.电脑启动过程介绍

    学习操作系统原理最好的方法是自己写一个简单的操作系统. 按一下电脑上的电源按钮,电脑就启动了,不一会儿电脑屏幕上就出现了登录界面或直接进入了桌面. 这是一个很日常的场景,但有时候会有个疑问:电脑内部是 ...

  9. Spring Cloud Alibaba 整合 Seata 实现分布式事务

    在Spring Boot单体服务中,添加@Transactional注解就能实现事务.在单体服务中,执行事务都是在同一个数据库下进行.但是随着业务越来越复杂,数据量越来越大会进行分库分表.在微服务场景 ...

  10. LeetCode-386 字典序排数

    来源:力扣(LeetCode)链接:https://leetcode-cn.com/problems/lexicographical-numbers 题目描述 给你一个整数 n ,按字典序返回范围 [ ...