Underscore.js 函数节流简单测试

时间 2019-11-18

标签 underscore.js underscore 函数节流简单测试栏目 JavaScript 繁體版

原文原文链接

函数节流在平常的DOM界面数据交互中有比较大的做用，能够减小服务器的请求，同时减小客户端的内存影响javascript

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

_.throttle 和 _.debounce java

简单的测试使用以下：jquery

须要使用的类库为jquery 、Underscore ajax

测试的方法为：mousemove 事件服务器

测试页面代码以下：app

<!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 交互中使用函数节流的方式有很大的帮助，减小了不少的没有必要的数据请求。spa