函数节流在日常的DOM界面数据交互中有比较大的作用，可以减少服务器的请求，同时减少客户端的内存影响

Underscore.js  本省就包含了函数节流的处理函数

_.throttle 和 _.debounce

简单的测试使用如下：

需要使用的类库为jquery  、Underscore

测试的方法为：mousemove 事件

测试页面代码如下：

<!DOCTYPE html >

<html>

<head>

    <script src="jquery-1.11.1.min.js" type="text/javascript"></script>

    <script src="underscore-min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            $('#infoapp').on('mousemove', alertinfo);  不使用节流方法

         //   $('#infoapp').on('mousemove', _.throttle(alertinfo, 5000));    使用节流方法  throttle

         //   $('#infoapp').on('mousemove', _.debounce(alertinfo, 1000, false));    使用节流方法debounce

        }

        )

       //  进行回调的事件处理函数

        function alertinfo() {

            var data = new Date();

            console.log(data);

        }

    </script>

</head>

<body>

    <div id="infoapp" style="background-color: Red; width: 200px; height: 200px;   margin:0 auto;">

    </div>

</body>

</html>

测试的结果如下：

结论：

总的来说对于我们在密集数据请求的ajax 交互中使用函数节流的方式有很大的帮助，减少了很多的没有必要的数据请求。

Underscore.js 函数节流简单测试的更多相关文章

  1. 也谈js函数节流

    1.什么是js函数节流 其本质就是不让某些代码(函数)在没有间断的情况下连续重复执行,目的就是让执行函数的请求停止了一段时间后才执行. 2.函数节流运用的场景 窗口大小的改变(resize事件),滚动 ...

  2. JS函数节流

    背景:在前端开发中,有时会为页面绑定resize事件,或为一个页面元素拖拽事件(其核心就是绑定mousemove)在一个正常操作中也有可能在一个短时间内触发非常多次事件绑定程序,而DOM操作是很消耗性 ...

  3. js 函数节流和防抖

    js 函数节流和防抖 throttle 节流 事件触发到结束后只执行一次. 应用场景 触发mousemove事件的时候, 如鼠标移动. 触发keyup事件的情况, 如搜索. 触发scroll事件的时候 ...

  4. Underscore——JS函数库

    转载请注明原文地址:https://www.cnblogs.com/ygj0930/p/10826065.html underscore是什么——它是一个js函数库 jQuery统一了不同浏览器之间的 ...

  5. 深入理解JS函数节流和去抖动

    一.什么是节流和去抖? 1.节流 节流就是拧紧水龙头让水少流一点,但是不是不让水流了.想象一下在现实生活中有时候我们需要接一桶水,接水的同时不想一直站在那等着,可能要离开一会去干一点别的事请,让水差不 ...

  6. JS函数节流代码实现

    函数被频繁调用场景 Js中的函数大多数情况下都是由用户主动调用触发的,一般不会遇到性能相关的问题.但在一些少数情况下,函数的触发不是由用户直接控制.在这些场景下,函数有可能被非常频繁地调用,而造成大的 ...

  7. 结构-行为-样式-Js函数节流

    最近一个面试官问了我一个函数节流的问题,然后感觉自己工作中遇到过这个问题,但是不知道这种形式就是函数节流.下面我来说下这个Js的高级问题,思路:函数节流就是防止用户高频调用某个事件而做的Js层面的处理 ...

  8. js 函数节流throttle 函数去抖debounce

    1.函数节流throttle 通俗解释: 假设你正在乘电梯上楼,当电梯门关闭之前发现有人也要乘电梯,礼貌起见,你会按下开门开关,然后等他进电梯: 但是,你是个没耐心的人,你最多只会等待电梯停留一分钟: ...

  9. JS函数节流和函数防抖问题分析

    问题1:如果实现了dom拖拽功能,但是在绑定拖拽事件的时候发现每当元素稍微移动一点便触发了大量的回调函数,导致浏览器直接卡死,这个时候怎么办? 问题2:如果给一个按钮绑定了表单提交的post事件,但是 ...

随机推荐

  1. zf2-tutorial调通，坑爹的init_autoloader.php

    zf2-tutorial的作者把init_autoloader.php内容写错了,新建个工程,把其中的这个文件的内容替一下,然后建库/建表,把local.ini打开(不是必须的),用户名/口令等配好, ...

  2. HTML的表格标签

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. codeforces #Round354-div2-D（BFS）

    题目链接:题目链接 题意:一个n*m的区域,每个格子都有上下左右四个门,相邻的两个格子A可以通向B当且仅当A对B的门和B对A的门都打开,问从起点S到终点T需要的最短时间 #include<bit ...

  4. IE6-8支持css3属性

    方法一.让IE6-8支持css3属性 <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shi ...

  5. lower_bound和upper_bound算法

    参考:http://www.cnblogs.com/cobbliu/archive/2012/05/21/2512249.html ForwardIter lower_bound(ForwardIte ...

  6. 在Silverlight中实施RESTful调用

    在Silverlight中实施RESTful调用:   http://book.51cto.com/art/201006/206314.htm    http://bbs.csdn.net/topic ...

  7. 编写postgresql函数执行循环copy命令导入大数据

    CREATE OR REPLACE FUNCTION copyData() RETURNS boolean AS $BODY$ DECLARE i int; begin i :=1; FOR i IN ...

  8. Activity Lifecycle

    Activity Lifecycle Activities in the system are managed as an activity stack(activity栈?). When a new ...

  9. Core Java Volume I — 4.7. Packages

    4.7. PackagesJava allows you to group classes in a collection called a package. Packages are conveni ...

  10. CentOS6 Squid代理服务器的安装与配置

    代理服务器英文全称是Proxy Server,其功能就是代理网络用户去取得网络信息.Squid是一个缓存Internet 数据的软件,其接收用户的下载申请,并自动处理所下载的数据.当一个用户想要下载一 ...