JS：函数的防抖与节流

共同点：在不影响客户体验的前提下,将频繁的回调函数,进行次数缩减.避免大量计算导致的页面卡顿.

差异：防抖是将多次执行变为最后一次执行

        节流是将多次执行变为在规定时间内只执行一次

1、防抖

什么是防抖呢？

触发事件后在规定时间内回调函数只能执行一次，如果在规定时间内又触发了该事件，则会重新开始算规定时间。

具体化：当客户只关心连续操作后所返回结果的时候，连续操作导致了事件频繁调用，但其实最后一次调用才是最主要的。

分类： 立即执行跟非立即执行

优化一个mousemove事件：

1、立即执行

应用场景：事件触发->执行回调函数->延时;如果在延时中,继续触发事件,则会重新进行延时.在延时结束后,并不会执行回调函数.常见例子:就是对于按钮防点击.例如点赞,心标,收藏等有立即反馈的按钮.

2、 非立即执行

应用场景：事件触发->延时->执行回调函数;如果在延时中,继续触发事件,则会重新进行延时.在延时结束后执行回调函数.常见例子:就是input搜索框,客户输完过一会就会自动搜索

2、节流

什么是节流呢？ 连续触发事件但是在规定时间内只执行一次函数。

适用的事件场景：

应用场景：需要监听填写手机号的数目

原先写法：直接绑定keyup事件

缺点：每当发生键盘输入事件时，就会一直调用方法（频繁调用，不必要且占用过多内存）

改写方法：

在ngOnInit就要调用这个监听事件（ps: 事件名不能是官方已经定义的名称）

还需要在ngDestory取消这个事件的监听

节流函数如下：

apply可参见：https://www.cnblogs.com/hxw1024/p/12077636.html