防抖函数中返回箭头函数与函数声明的差异及调用区别解析

这两种防抖实现的差异主要体现在参数传递方式、this指向处理以及返回函数的this特性三个方面：

1. 参数传递的差异 #

• 第一种写法中，cb(args)是将收集到的args数组作为单个参数直接传给回调函数。如果原回调函数期望接收多个独立参数（比如function(a, b) { ... }），实际接收到的会是一个数组，导致参数不匹配。
  示例：调用防抖后的函数debouncedFunc(1, 2)，原回调cb会收到[1,2]作为第一个参数，而非1和2两个独立参数。
• 第二种写法用func.apply(this, args)，会将args数组展开为多个独立参数传递给回调，完全匹配原函数的参数预期。同样调用debouncedFunc(1,2)，原回调func会正常收到1和2两个参数。

2. this指向的处理差异 #

• 第一种写法直接调用cb(args)时，回调的this指向取决于执行环境：非严格模式下指向全局对象（浏览器中是window），严格模式下是undefined，无法保留原函数调用时的上下文。
• 第二种写法通过func.apply(this, args)显式绑定了this，这里的this来自外层返回的箭头函数——箭头函数的this继承自debounce函数被调用时的上下文，能正确保留原函数的调用语境。

3. 返回函数的this特性差异 #

• 第一种写法返回的是普通函数：这个函数的this会在调用时动态绑定（比如作为DOM事件回调时，this指向触发事件的元素），但回调cb本身的this还是无法继承这个上下文。
• 第二种写法返回的是箭头函数：箭头函数没有自己的this，它的this固定为debounce函数被调用时的上下文，意味着无论防抖后的函数怎么调用，回调func的this都不会改变。

内容的提问来源于stack exchange，提问作者Brandi