文章目錄

• 一. 防抖
• • • 1. 什么是防抖
    • 2. 常見應(yīng)用場景
    • 3. 代碼實(shí)現(xiàn)思路
• 二. 節(jié)流
• • • 1. 什么是防抖
    • 2. 常見應(yīng)用場景
    • 3. 代碼實(shí)現(xiàn)思路
• 三. 面試總結(jié)
• • • 1. 防抖
    • 2. 節(jié)流

成都創(chuàng)新互聯(lián)公司自成立以來，一直致力于為企業(yè)提供從網(wǎng)站策劃、網(wǎng)站設(shè)計(jì)、成都網(wǎng)站設(shè)計(jì)、網(wǎng)站制作、電子商務(wù)、網(wǎng)站推廣、網(wǎng)站優(yōu)化到為企業(yè)提供個(gè)性化軟件開發(fā)等基于互聯(lián)網(wǎng)的全面整合營銷服務(wù)。公司擁有豐富的網(wǎng)站建設(shè)和互聯(lián)網(wǎng)應(yīng)用系統(tǒng)開發(fā)管理經(jīng)驗(yàn)、成熟的應(yīng)用系統(tǒng)解決方案、優(yōu)秀的網(wǎng)站開發(fā)工程師團(tuán)隊(duì)及專業(yè)的網(wǎng)站設(shè)計(jì)師團(tuán)隊(duì)。

---

一. 防抖 1. 什么是防抖

所謂的防抖就是指連續(xù)觸發(fā)事件但是在設(shè)定的一段時(shí)間內(nèi)中只執(zhí)行最后一次。
例如：設(shè)定1000毫秒執(zhí)行，當(dāng)你觸發(fā)事件了，他會1000毫秒后執(zhí)行，但是在還剩500毫秒的時(shí)候你又觸發(fā)了事件，那就會重新開始1000毫秒之后再執(zhí)行。

2. 常見應(yīng)用場景

1. 搜索框搜索輸入
在我們在所搜框輸入時(shí)，不能每次輸入都觸發(fā)一次請求，這樣會非常的消耗系統(tǒng)性能，那么這時(shí)就可以用到防抖。
2.文本編輯器實(shí)時(shí)保存
在文本編輯器實(shí)時(shí)保存的應(yīng)用場景下，不需要用戶每次輸入都進(jìn)行一次保存，而是可以設(shè)置一個(gè)時(shí)間，多長時(shí)間后再去進(jìn)行一個(gè)自動保存。

3. 代碼實(shí)現(xiàn)思路

如果面試官問我們防抖的代碼實(shí)現(xiàn)思路，那么我們可以回答利用定時(shí)器。
如下例子:

let timerId = null;
document.queryselector('.ipt').onkeyup= function (){if (timerId !=null){clearTimeout(timerId)
	}
	timerId = setTimeout(()=
	console.1og('我是防抖')
	},1000)
}

在我們的實(shí)際開發(fā)中除了可以自己進(jìn)行手寫還可以使用lodash進(jìn)行實(shí)現(xiàn)，相關(guān)技術(shù)各位讀者朋友可以自行查閱相關(guān)文章。

二. 節(jié)流 1. 什么是防抖

就是指連續(xù)觸發(fā)事件但是在設(shè)定的一段時(shí)間內(nèi)中只執(zhí)行一次函數(shù)。
例如：設(shè)定1000毫秒執(zhí)行，那你在1000毫秒觸發(fā)在多次，也只在1000毫秒后執(zhí)行一次。

2. 常見應(yīng)用場景

節(jié)流的引用場景比較多常見的有：
1.高頻事件例如快速點(diǎn)擊、鼠標(biāo)滑動、resize事件、scroll事件
對于這類高頻的事件，我們可以設(shè)置一個(gè)時(shí)間，在設(shè)定事件內(nèi)不管觸發(fā)多少次事件都不會觸發(fā)相應(yīng)的業(yè)務(wù)邏輯代碼，只有這段時(shí)間結(jié)束后再進(jìn)行下一輪執(zhí)行
2. 下拉加載 視屏播放記錄時(shí)間
對于這一類，我們也可以設(shè)置一個(gè)時(shí)間，設(shè)定多少秒記錄一次，這樣就不會過多的損耗我們系統(tǒng)的性能。

3. 代碼實(shí)現(xiàn)思路

如果面試官問我們防抖的代碼實(shí)現(xiàn)思路，那么我們可以回答利用定時(shí)器。
如下例子:

let timerId = null;
document.queryselector('.ipt').onmouseover= function (){if (timerId !=null){return
	}
	timerId setTimeout(()=>{console.log('我是節(jié)流)
	timerId = null
   },100)
}

在開發(fā)中對于節(jié)流除了我們手寫也可以使用lodash進(jìn)行實(shí)現(xiàn)，相關(guān)技術(shù)各位讀者朋友可以自行查閱相關(guān)文章。

三. 面試總結(jié) 1. 防抖

單位時(shí)間內(nèi)，頻繁觸發(fā)事件，只執(zhí)行最后一次。

2. 節(jié)流

單位時(shí)間內(nèi)，頻繁觸發(fā)事件，只執(zhí)行一次。

你是否還在尋找穩(wěn)定的海外服務(wù)器提供商？創(chuàng)新互聯(lián)www.cdcxhl.cn海外機(jī)房具備T級流量清洗系統(tǒng)配攻擊溯源，準(zhǔn)確流量調(diào)度確保服務(wù)器高可用性，企業(yè)級服務(wù)器適合批量采購，新人活動首月15元起，快前往官網(wǎng)查看詳情吧

本文標(biāo)題：前端面試?？紎節(jié)流與防抖-創(chuàng)新互聯(lián)
URL地址：http://m.rwnh.cn/article32/iidpc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制網(wǎng)站、動態(tài)網(wǎng)站、全網(wǎng)營銷推廣、網(wǎng)站設(shè)計(jì)公司、響應(yīng)式網(wǎng)站、微信公眾號

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)