前端防抖和节流合二为一
理论小结:
函数防抖和函数节流都是防止某一时间频繁触发,但是这两兄弟之间的原理却不一样。
函数防抖是某一段时间内只执行一次,而函数节流是间隔时间执行。
实现登录按钮在间隔时间内不会向手机一直发送验证请求:
function throttle(fn, wait) {
var pre = Date.now();
return function() {
var context = this;
var args = arguments;
var now = Date.now();
if (now - pre >= wait) {
fn.apply(context, args);
pre = Date.now();
}
}
}
// 一键登录
$('#btnLoginMyPhone').addEventListener("click", throttle(quickLogin, 3000));
function quickLogin() {
var boxFlag = $(":checkbox").is(':checked');
if (!boxFlag) {
showError("请同意登录服务协议");
return;
}
if (msisdn) {
login('G4');
return;
} else {
var phone = $.trim($('#phone').val());
if (!mobileValidate(phone)) {
showError('请输入正确的手机号');
} else {
// 禁止用户重复点击
if (repeatFlag) {
showError("请勿重复点击");
return;
}
sendSimAuth(phone);
showPopAlert('请在手机上确认登录');
}
}
}
前端防抖和节流合二为一相关推荐
- 前端防抖与节流超详细讲解
前端防抖与节流超详细讲解 前言 防抖 什么是防抖 实现防抖函数 节流 什么是节流 实现节流函数 防抖与节流注意事项 前言 防抖与节流通常作为项目优化的手段,一般都是为了防止用户在短时间内快而频地多次操 ...
- js基于lodash实现前端防抖与节流
- 前端面试查漏补缺--(一) 防抖和节流
前言 本系列最开始是为了自己面试准备的.后来发现整理越来越多,差不多有十二万字符,最后决定还是分享出来给大家. 为了分享整理出来,花费了自己大量的时间,起码是只自己用的三倍时间.如果喜欢的话,欢迎收藏 ...
- 防抖与节流方案_前端ajax优化解决方案
伴随着前端ajax的应用场景越来越多,那就免不了一个整合的ajax优化解决方案了,自己优化太麻烦?没事,有它帮你解决:hajax 与当下比较热门的请求库 axios 和原生的 fetch相比,haja ...
- 前端面试--什么是防抖和节流
写在前面 CSDN话题挑战赛第1期 活动详情地址:https://marketing.csdn.net/p/bb5081d88a77db8d6ef45bb7b6ef3d7f 参赛话题:前端面试宝典 话 ...
- 马小看前端(防抖和节流)
马小看前端(防抖节流) 在前端的开发过程中,有一部分用户行为频繁的去触发事件,而对于dom操作来说,有耗费性能的问题,很可能导致卡顿,甚至浏览器的崩溃,防抖和节流就是为了解决这个问题 防抖: 实现的场 ...
- 前端战五渣学JavaScript——防抖、节流和rAF
看了<JavaScript高级程序设计>和网上的一些博客,感觉对函数节流和函数防抖的概念是反的,以下我写的关于防抖和节流的概念取决于多数人的概念吧,并且基于伦敦前端工程师David Cor ...
- 前端百题斩【021】——通俗易懂的防抖与节流
写该系列文章的初衷是"让每位前端工程师掌握高频知识点,为工作助力".这是前端百题斩的第21斩,希望朋友们关注公众号"执鸢者",用知识武装自己的头脑. 性能一直是 ...
- 前端基础-防抖和节流
大家好,我是龙骑士,今天给大家讲一下前端基础:防抖和节流 防抖 高频事件触发后, n 秒内函数只会执行一次,如果 n 秒内高频事件再次被触发,则重新计算冷却时间 节流 高频事件n 秒内,函数不论触发 ...
最新文章
- 对‘初学者应该选择哪种编程语言’的回答——计算机达人成长之路(38)
- 8.QT的事件循环与事件发送相关类
- php定界符EOF讲解
- 天津春考计算机重点知识,天津春考第一学期期中试卷(计算机基础)
- 双重ScrollView,RecyclerView联动实例
- 背水一战 Windows 10 (55) - 控件(集合类): SemanticZoom, ISemanticZoomInformation
- 卸载nginx php mysql_ubuntu16.04彻底删除nginx+php
- ERP核心业务流程和Oracle-ERP业务和数据对象分析
- C#遍历文件夹下所有文件
- VC2013 ArcGIS Engine 10.0开发环境搭建
- 厦门大学考研:必知20大时间节点
- ajax调用一般应用程序,【Web前端】---js调用本地应用程序
- Lavas 安装和项目构建
- 【WINDOWS / DOS 批处理】添加注释
- 三角波发生器电路原理分析
- unity将指定UI图片置为灰色
- stata两种方法查看命令源代码
- Solidity入门-开发众筹智能合约
- HB100多普勒雷达+STM32L476VGTx测速系统的电路设计(滤波放大比较器)
- 格力2代,原厂固件hola1.2.2
热门文章
- nsx很可爱的公众号 vSAN 文章合集
- VMware ESXi 6.X Syslog日志配置
- 消息中间件学习总结(20)——主流MQ比较及MQ常见使用场景总结
- Linux学习总结(49)——应当竭力避免在系统中运行的 Linux 命令
- Java基础学习总结(58)——JAVA堆、栈详解
- FastDFS学习总结(2)--Tracker与Storage配置详解
- python用http协议传数据_《Python网络爬虫》1.3 HTTP协议基础知识
- “为什么中国没有Apache基金会这样的组织?”
- 2018最有影响力的CRM系统排行榜
- JavaScript高级程序设计学习(二)之基本概念