函数节流:不断触发一个函数后,执行第一次,只有大于设定的执行周期后才会执行第二次

 /*
节流函数:fn:要被节流的函数,delay:规定的时间
*/
function throttle(fn,delay){
// 记录上一次函数出发的时间
var lastTime = 0
return function(){
// 记录当前函数触发的时间
var nowTime = new Date().getTime()
// 当当前时间减去上一次执行时间大于这个指定间隔时间才让他触发这个函数
if(nowTime - lastTime > delay){
// 绑定this指向
fn.call(this)
//同步时间
lastTime = nowTime
}
}
}

函数防抖:不断触发一个函数,在规定时间内只让最后一次生效,前面都不生效

 function debounce(fn,delay){
var timer = null
// 清除上一次延时器
return function(){
clearTimeout(timer)
// 重新设置一个新的延时器
timer = setTimeout(() => {
fn.call(this)
}, delay);
}
}

更多面试题请前往githubhttps://github.com/bettersong/interview

js面试题之手写节流函数和防抖函数的更多相关文章

  1. 面试题|手写JSON解析器

    这周的 Cassidoo 的每周简讯有这么一个面试题:: 写一个函数,这个函数接收一个正确的 JSON 字符串并将其转化为一个对象(或字典,映射等,这取决于你选择的语言).示例输入: fakePars ...

  2. 前端面试题之手写promise

    前端面试题之Promise问题 前言 在我们日常开发中会遇到很多异步的情况,比如涉及到 网络请求(ajax,axios等),定时器这些,对于这些异步操作我们如果需要拿到他们操作后的结果,就需要使用到回 ...

  3. 前端面试题整理——手写AJAX

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 前端面试题整理——手写bind函数

    var arr = [1,2,3,4,5] console.log(arr.slice(1,4)) console.log(arr) Function.prototype.bind1 = functi ...

  5. 前台js分页,自己手写逻辑

    js代码如下: //设置分页 var pageSize = 10; //设置一次显示多少页 var pageLimit = 5; $(function(){ //查询所有内容 $.post(ctx + ...

  6. 前台js分页,自己手写逻辑2

    //设置分页 var pageSize = 10; //设置一次显示多少页 var pageLimit = 5; $(function(){ $.post("rest/rtdbfix/lis ...

  7. 前端面试题整理——手写简易jquery

    class jQuery { constructor(selector) { const result = document.querySelectorAll(selector) console.lo ...

  8. 前端面试题整理——手写方法解析URL参数

    //拆分字符串形式 function queryToObj() { const res = {} const search = location.search.substr(1);//去掉前面的&qu ...

  9. 前端面试题整理——手写flatern摊平数组

    // flatern 是摊平数组 function flat(arr) { const isDeep = arr.some(item => item instanceof Array) if(! ...

随机推荐

  1. laravel5 怎么获取数组形式的数据

    当构建 JSON API 时,您可能常常需要把模型和关联对象转换成数组或JSON.所以Eloquent里已经包含了这些方法.要把模型和已载入的关联对象转成数组,可以使用 toArray方法: $use ...

  2. js写出你的名字的拼音,判断哪个字母出现的最多

    function fn(str) { var obj = {}; for (var i = 0; i < str.length; i++) { if (!obj[str.charAt(i)]) ...

  3. 洛谷P4860 Roy&October之取石子II 题解 博弈论

    题目链接:https://www.luogu.org/problem/P4860 和<P4018 Roy&October之取石子>一样的推导思路,去找循环节. 可以发现:只要不能被 ...

  4. 全面解读Python Web开发框架Django,利用Django构建web应用及其部署

    全面解读Python Web开发框架Django Django是一个开源的Web应用框架,由Python写成.采用MVC的软件设计模式,主要目标是使得开发复杂的.数据库驱动的网站变得简单.Django ...

  5. HDU 1026 BSF+优先队列+记录路径、

    #include<iostream> #include<cmath> #include<cstring> #include<cstdio> #inclu ...

  6. Python--day24--复习

  7. Python--day31--TCP的长链接

  8. 4-1 自动生成spider模板的命令

    scrapy genspider 爬虫名 爬取得网站url例:scrapy genspider jobble2 blog.jobbole.com

  9. C# 传入 params object 长度

    刚刚 LiesAuer 大神问了一个问题,如果在 params object 传入 object 数组,那么拿到的值是的长度是多少 我做了测试在传入不同的值可能拿到不同的长度 先来说总结 传入一个数组 ...

  10. golang http get请求方式

    client := &http.Client{} //生成要访问的url,token是api鉴权,每个api访问方式不同,根据api调用文档拼接URLurl := fmt.Sprintf(&q ...