节流技术常用于优化性能，通过限制事件处理函数的执行频率，避免在短时间内频繁触发，如滚动条位置计算、商品预览图放大镜效果等场景。这样可以有效地节省资源，提高页面响应速度。
节流使用的场景：
将减少一段时间内触发的频率。
可以将一些事件降低触发频率。比如懒加载时要监听计算滚动条的位置，但不必每次滑动都触发，可以降低计算的频率，而不必去浪费资源；另外还有做商品预览图的放大镜效果时，不必每次鼠标移动都计算位置。
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="IE=edge, chrome=1">
<title>throttle</title>
<style>
#container {
width: 100%;
height: 200px;
line-height: 200px;
text-align: center;
color: #fff;
background-color: #444;
font-size: 30px;
}
</style>
</head>
<body>
<div id="container"></div>
<script>
//节流的原理：如果你持续触发事件，每隔一段时间只会执行一件事
// 根据首次是否执行以及结束后是否执行，效果有所不同，实现的方式也不同
//我们用leading代表首次实行，trailling代表结束后是否再执行一次
//实现思路&#
最低0.47元/天 解锁文章
扫一扫
529
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
