JavaScriptの面接問題-関数の流れ?手ブレ?

6841 ワード

関数の流れ
一つの関数を一回実行すると、設定された実行期間より大きい場合にのみ、2回目の実行が可能になります.
function throttle(fun, delay) {
    let startTime = 0

    //  this   window
    console.log(this)
	//           
    return function () {
        let nowTime = Date.now()
      	//                      
        if (nowTime -startTime > delay) {
            // this   document
            console.log(this)

            fun()

            //   this        document 
            // fun.call(this)

            startTime = nowTime

        }
    }

}

document.onmousemove = throttle(function () {
    console.log(Date.now())
    //     this    ,this   window
    console.log(this)
}, 3000)
振れを防ぐ
頻繁に触発される関数を指定します.最後の時間だけ有効にします.
let txt = document.getElementById('txt')

function debounce(fn, delay) {
    let timer = null

    return function () {
      	//         
        clearTimeout(timer)
        //      
        timer = setTimeout(function() {
            //    this   
            fn.apply(this)

            console.log(this)

        }.bind(this), delay)
    }
}
txt.onkeyup = debounce(function () {
    console.log('  ')
    console.log(this)
}, 1000)