函数
1. 函数防抖
js
function debounce(func, duration = 500) {
let timerId;
// return 返回的函数一定不要用箭头函数,因为保证 this 一致
return function(...args) {
clearTimeout(timerId);
// setTimeout 一定要用箭头函数
timerId = setTimeout(() => {
func.apply(this, args)
}, duration);
};
}
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
2. 函数节流
3. Js 的函数节流和函数防抖的区别
- 函数节流是指一定时间内
js
方法只执行一次。函数防抖是指频繁触发的情况下,只有足够的空闲时间,才执行代码次 - 函数节流是 声明一个变量当标志位,记录当前代码是否在执行,如果正在执行,取消这次方法执行,直接
return
,如果空闲,正常触发方法执行 - 函数防抖是需要一个延时器来辅助实现,延迟执行需要执行的代码,如果方法多次触发,把上次记录的迟执行代码用
cleartimeout
清除掉重新开始,如果计时完毕,没有方法来访问触发,则执行代码
4.普通函数和构造函数的区别
- 构造函数也是一个普通函数,创建方式和普通函数一样,但是构造函数习惯上首字母大写
- 调用方式不一样,普通函数直接调用,构造函数要用关键字 new 来调用
- 调用时,构造函数内部会创建一个新对象,就是实例,普通函数不会创建新对象
- 构造函数内部的 this 指向实例,普通函数内部的 this 指向调用函数的对象 (如果没有对象调用,默认为 window)5.构造函数默认的返回值是创建的对象 (也就是实例),普通函数的返回值由 return 语句决定
- 构造函数的函数名与类名相同
5. this 指向
在JavaScript
中,this
通常指向的是我们正在执行的函数本身,或者是指向该函数所属的对象
- 全局的
this
>指向的是Window
- 对象中的
this
指向其本身 - 事件中
this
>指向事件对象