面试了许多求职者,很多求职者只知其然,而不知所以然,写此文章为广大前端小伙伴指引迷津。纯干货!纯干货!纯干货!
目录
节流
什么是节流?
答:短时间大量触发事件,只会按照一定的频率去触发。
节流的作用?
答:防止事件触发频繁,影响性能。
节流的实现原理?
答:判断是否到达一定时间来触发函数。
节流的使用场景?
答:无限滚动页面。
节流的缺陷?
答:大量使用会导致内存泄漏。
节流的笔试题?
手写节流函数。思路:在规定时间内只触发一次
// 定时器版本
function throttle (fn, delay) {
var run = true
return function () {
if (!run) return
let _this = this, args = arguments
setTimeout (() => {
fn.apply(_this, args)
run = false
}, delay)
}
}
// 时间戳版本
function throttle(fn, wait) {
let previous = 0
return function () {
let now = Date.now(), self = this, ags = arguments
if (now - previous > wait) {
fn.apply(self, ags)
previous = now
}
}
}
面试大白话
答:首先,节流是短时间大量触发事件,只会按照一定的频率去触发。其主要目的也是为了防止事件触发频繁,影响性能。它的原理就是判断是否到达一定时间来触发函数。我们项目里面一般就是无限滚动页面触发相应事件。不过节流用的太多,会导致内存泄漏。