黑莓手机论坛 一分快三技巧 - 绿色软件 - 绿色软件下载 - JZ5U绿色下载站 一分快三分析 九酷音乐网|好听的歌|网络歌曲|dj舞曲|流行歌曲大全 一分快三遗漏 软件下载_更快更安全的软件下载中心_2345软件大全(多特软件下载站)

【js】什么是函数节流与函数去抖

函数节流

意思:节省流量,不会一直访问。 | 指定时间内不执行,指定时间后执行。 | 一段时间内只执行一次

场景:

比如控制游戏人物攻击,时间内就算按得很快,也只能砍一刀,过后才能砍第二刀。

搜索引擎联想词。搜索框的oninput事件节流。

参数:一个函数,一个时间

返回:一个函数

对比时间进行处理

function throttle(func,time){
    let lastTime=null
    return function(){
        let now=new Date()
        if(now-lastTime-time > 0){
            func()
            lastTime = now
        }
    }
}
//调用
let run=throttle(function(){
    console.log(123)
},1000)
window.addEventListener('scroll',run)

function throttle(func,time){
    let prev=0;
    return function(){
        let now=Date.now()
        let _this=this;
        if(now-prev >= time){
            func.apply(this,arguments)
            prev = now
        }
    }
}
let d1
=document.querySelector("#d1") let input1=document.querySelector("#input1") input1.onclick=throttle(function(){ d1.innerText=parseInt(d1.innerText)+1 },1000)

 

函数防抖

意思:防止都抖动。空闲时间后只执行一次。

场景:

搜索框的联想词,输入框连续输入文字时不会去查询后台接口,输入暂停时才会去查询接口

参数:一个函数,一个时间

返回:一个函数

上拉加载下一页。当页面滚动结束后,若在页面底部,再执行加载。

输入框,当用户频繁输入时,不执行,停止输入时执行

clearTimeout和setTimeout进行处理。

function debounce(func,time){
    let timer=null
    return function(){
        clearTimeout(timer)
        timer=setTimeout(()=>{
            func.apply(this,arguments)
        },time)
    }
}

 

懒加载

一屏一屏加载图片,可以减少服务器加载压力

 

预加载

提前加载内容,但不渲染,或隐藏的。会加重服务器压力

 

更多知识点和详细,之后补上

posted @ 2019-05-16 00:15 海瑞菌·一分快三走势图 阅读(...) 评论(...) 编辑 收藏