#### 二、实现
1. 防抖的实现
**实现**： 实现前端一个按钮，当你`频繁点击`时，并`不会`发送请求，只有当你在规定时间内`没有再点击`时，才会执行函数。如果停止点击但是在规定时间内`再点击`，会重新`触发计时`。
**思路**：在一段连续操作结束后，处理回调，利用`clearTimeout`和`setTimeout`实现。
前端代码：
js代码： (这里涉及到了闭包及this的原理)
function debounce(func,wait){
let timeout,result
return function(){
let args=[...arguments] //获取事件参数
clearTimeout(timeout) //清除上一次的定时器
timeout= setTimeout(()=>{
result=func.apply(this,args) //this显示绑定
},wait)//定时器会修改this指向 定时器词法环境大多数都是window
return result
}
- 节流的实现
实现： 实现前端一个按钮，在一个规定时间内，只能触发一次函数。如果这个时间内按钮多次点击，只有一次生效。
思路：使用时间戳的写法实现。
前端代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="./throttle.js"></script>
<title>Document</title>
</head>
<body>
<button id="btn">0</button>
<script>
let count=0
let btn=document.getElementById("btn")
function add(){
console.log(count);
btn.innerHTML=count++
return 123
}
btn.addEventListener('click',throttle(add,1000))
</script>
</body>
</html>
js代码： (这里涉及到了闭包及this的原理)
function throttle(func, wait) {
let preTime = 0 //上一次的时间
return function () {
let args = [...arguments] //获取事件参数
let now = +new Date() //时间戳 精准到秒
if (now - preTime > wait) { //点击第二次的时候判断时间有没有到
func.apply(this, args)
preTime = now
}
}
}
三、应用场景
防抖：
- 搜索框搜索输入。只需用户最后一次输入完，再发送请求
节流：
- 滚动加载，加载更多或滚到底部监听
总结
个人理解，防抖就是“一直抖”(频繁触发事件)，直到停下来了才执行最后那一次触发；节流就是按照规定时间间隔来，这个规定时间内只执行一次。
大厂面试题分享 面试题库
文末
技术是没有终点的，也是学不完的，最重要的是活着、不秃。
零基础入门的时候看书还是看视频，我觉得成年人，何必做选择题呢，两个都要。喜欢看书就看书，喜欢看视频就看视频。
最重要的是在自学的过程中，一定不要眼高手低，要实战，把学到的技术投入到项目当中，解决问题，之后进一步锤炼自己的技术。
自学最怕的就是缺乏自驱力，一定要自律，杜绝“三天打鱼两天晒网”，到最后白忙活一场。
高度自律的同时，要保持耐心，不抛弃不放弃，切勿自怨自艾，每天给自己一点点鼓励，学习的劲头就会很足，不容易犯困。
技术学到手后，找工作的时候一定要好好准备一份简历，不要无头苍蝇一样去海投简历，容易“竹篮打水一场空”。好好的准备一下简历，毕竟是找工作的敲门砖。
拿到面试邀请后，在面试的过程中一定要大大方方，尽力把自己学到的知识舒适地表达出来，不要因为是自学就不够自信，给面试官一个好的印象，面试成功的几率就会大很多，加油吧，骚年！
