请问老师关于callback

Question

请问以下老师这里的apply的用意是什么意思？

这里的this我理解就是闭包函数的this，arguments也没有实际作用。老师可以稍微解释一下吗，的确不是很明白为什么这样做，为什么不直接调用传入的callback?

Answer 1

提问者 hy_wang 2020-09-28 21:46:19

export function debounce(deley, callback) {
let task;
return function () {
clearTimeout(task)
console.log(this, 'this')
task = setTimeout(() => {
console.log(this, 'this2')
callback.apply(this, arguments)
}, deley)
}
}

首先，调用方式是

window.addEventListener("resize", debounce(100, initSize, "a", "b"));

这里两次打印this都是window对象，所以我不是很明白apply是怎么改变，

以及arguments的作用是什么，它在内层的return函数中，而return 的function中arguments不存在任意意义啊，它怎么记录传递的参数？请老师解惑

• 扬_灵 #1

  同学你好，这里的this应该在回调函数执行的时候打印，不是在debounce中打印，debounce是典型个的节流函数。

Answer 2

扬_灵 2020-09-28 10:23:00

同学你好，这是使用apply的用意是用来绑定this的，arguments是用来记录函数传递的参数的。在debounce中使用callbakc(this,arguments)后在onResize函数打印发现this的指向是window,使用callback.apply(this,arguments)后在onResize函数打印发现this的指向是事件对象,setTimeout()函数中作用域是全局的，也就是setTimeout中的this指的是window。用apply绑定this指向resize的this，这也是为什么不直接调用传递的callback的原因。就是为了让callbakc函数内的this与原本的事件回调函数绑定的this保持一致。

• 提问者 hy_wang #1

  老师我还是不是很明白，请老师解惑

• 诺丁山丶 #2

  我试验了下，发现不使用apply，结果也是一样的，不影响最终的操作。
  export default function debounce(delay, callback) {
    let task
    return function() {
      clearTimeout(task)
      task = setTimeout(() => {
        callback()
      }, delay)
    }
  }