首页 > 其他分享 >手写防抖节流函数

手写防抖节流函数

时间:2023-04-12 09:55:35浏览次数:33  
标签:function 防抖 节流 timeId 手写 now fn 函数

防抖函数

function debounce(fn, t) {    let timeId    return function () { // 如果有定时器就清除    if (timeId) clearTimeout(timeId) // 开启定时器 200    timeId = setTimeout(function () {      fn()    }, t)   } } // 节流函数 throttle function throttle(fn, t) { // 起始时间    let startTime = 0    return function () {    // 得到当前的时间    let now = Date.now()    // 判断如果⼤于等于 500 采取调⽤函数         if (now - startTime >= t) {              // 调⽤函数             fn()            // 起始的时间 = 现在的时间 写在调⽤函数的下⾯            startTime = now          }    } }

标签:function,防抖,节流,timeId,手写,now,fn,函数
From: https://www.cnblogs.com/Daguaishou0704/p/17308786.html

相关文章

  • 手写一个深拷贝
    functiondeepClone(obj){if(typeofobj!='object')returnobject//1、建立新容器vartemp=array.isArray(obj)?[]:{}//2、通过遍历将原有数组的值循环出来放到新建立的容器上for(letkeyinobj){if(obj.hasOwnProper......
  • 第二篇 手写原理代码 - 函数【 函数防抖 、函数节流 】
    函数防抖和函数节流都是优化高频事件处理的JavaScript技术。它们可以限制函数的调用,在一定程度上减少计算、网络请求和提高响应速度,但它们的实现方式略有不同函数防抖:延迟执行函数,只有在事件停止后才会执行最后一次事件函数节流:定期执行函数,每隔一段时间执行一次通常情况下,......
  • 第四篇 手写原理代码 - 函数 【 实现 compose 函数 】
    JavaScript中的Compose函数用于组合一些函数,使得每个函数都接收上一个函数的返回值作为参数,并返回一个新的函数。可以使用这种方式把多个函数串起来,从而实现更复杂的逻辑Comopse函数是一个非常有用的工具,它可以帮助我们简化程序逻辑,实现代码复用,提高开发效率实现compose......
  • 第六篇 手写原理代码 - 对象 【 实现 AJAX 请求 】
    AJAX是AsynchronousJavaScriptandXML的缩写,指的是通过JavaScript和XML技术在不重新加载整个页面的情况下,实现与服务器之间异步通信的技术。使用AJAX技术能够使网页更加动态和用户友好。JavaScript的AJAX技术借助于浏览器内置的XMLHttpRequest对象实现。XMLHttp......
  • 第五篇 手写原理代码 - 对象 【 实现 new 过程、实现 instanceof 】
    在JavaScript中,new关键字用于创建一个对象实例,它通常与构造函数一起使用。当使用new关键字时,会发生以下几件事情:1、创建一个新对象,并将该对象的属性设置为构造函数的原型(即__proto__)2、将构造函数的作用域绑定到新对象上,并执行构造函数中的代码3、如果构造函数返......
  • 第七篇 手写原理代码 - 对象 【 实现对象的深度拷贝、实现对象的深度对比 】
    在JavaScript中,对象拷贝可以分为浅拷贝和深拷贝两种方式1、浅拷贝浅拷贝只是复制了对象的引用地址,新对象的属性与原对象的属性指向同一块内存地址2、深拷贝深拷贝会完整地复制对象以及其内部所有嵌套对象使用JSON.parse(JSON.stringify())方法进行深拷贝......
  • 第九篇 手写原理代码 - 数组 【 实现 forEach、map、filter、every、some 】
    1、forEachArray.prototype.my_forEach=function(callback){for(leti=0;i<this.length;i++){callback(this[i],i,this);}};2、mapArray.prototype.my_map=function(callback){constarr=[];for(leti=0;i<this.length;......
  • 第八篇 手写原理代码 - 对象 【 实现 Object.assign() 和 Object.create() 】
    1、Object.assign(target,...sources)Object.assign()方法用于将一个或多个源对象的属性复制到目标对象中。它只复制源对象自身可枚举的属性,同时也能够拷贝getter和setter函数2、Object.create(proto[,propertiesObject])Object.create()方法创建一个新对象,使......
  • 自己手写一个js的双向绑定
    今天研究了一下JS的双向绑定。发现这东西最核心的是浏览器内置的Object.defineProperty方法或者Object.defineProperties,前者只能定义对象的一个属性与相应的元素进行绑定,后者可以定义一组进行绑定。不废话了,直接上代码://代码的效果:定时修改对象中的message属性值,然后页面的H1......
  • PAC主成分分析__784手写特征案例
    fromsklearn.neighborsimportKNeighborsClassifierasKNNfromsklearn.decompositionimportPCAfromsklearn.ensembleimportRandomForestClassifierasRFCimportmatplotlib.pyplotaspltfromsklearn.model_selectionimportcross_val_scoreimportpandasas......