🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
### 什么是js垃圾回收机制(前提) 垃圾回收机制(GC:Garbage Collection):执行环境负责管理代码执行过程中使用的内存。JS的垃圾回收机制是为了以防内存泄漏,内存泄漏的含义就是当已经不需要某块内存时这块内存还存在着,没有被释放,导致该内存无法被使用,垃圾回收机制就是间歇的不定期的寻找到不再使用的变量,并释放掉它们所指向的内存。 其实我们通俗的解释就是:js存在专门的机制去处理我们不用的一些东西,不论是简单数据类型还是复杂数据类型。 ``` 简单举例:var a =1,我们定义了变量a,并且给它赋值为1,随后我们去改变a的值,a = 100, 现在的话我们知道a的值变成了100,那么数值1我们肯定就不会用到了, 那么js的垃圾回收机制会帮助我们把数值1给回收了,为了避免内存泄漏! ``` **闭包的概念:** `函数内部返回一个函数,这个内部函数被外界所引用`,这个内部函数就不会被js回收机制所销毁,内部函数所用到的外部函数的变量也不会被销毁。 ``` 示例: function outer() { let name = 'james' let age = 37 //返回一个函数 return function() { return name + ' is superstar'; } } let func = outer() console.log(func()); //james is superstar ``` **代码解析** 在上方代码中我们定义了一个外部函数outer(),在外部函数内部返回了一个函数(内部函数),随后在外界中将外部函数赋给了func,这个func就是内部函数,然后执行func(),打印出来了相应的结果,在这里,我们使用了外部函数内定义的属性name和内部函数,所以name和内部函数不会被js回收机制所处理,但是属性age我们并没有使用,所以age被js垃圾回收机制所回收! * **优点和缺点** * 在代码解析中,我们知道了 我们所创建的临时变量`name`将不会被回收,所以闭包的优点就是:`让临时变量可以永驻内存`。 * 但是如果我们不停的执行`func`,那么就会出问题,这样的话会使内存中不断的储存临时变量,就会导致`内存泄漏`,所以闭包的缺点就是:`会造成内存泄漏`。 **应用:闭包防抖和节流** 1.在这里写一个搜索框,搜索框的内容输入频次可以使用`防抖`或`节流`来优化 ``` <input type="text" id="search"> ``` 防抖: ``` search.oninput = (function() { let timer = null return ()=>{ if(timer) { clearTimeout(timer) } timer = setTimeout(()=>{ console.log('发送了ajax请求'); },500) } })() ``` 节流: ``` search.oninput = (function(){ let flag=true return ()=>{ if(flag) { setTimeout(()=>{ console.log('发送了ajax请求'); flag = true },500) } flag = false } })() ``` 闭包的实战常见场景主要是在防抖和节流中,就是为了防止在防抖和节流中我们创建的`临时变量`会丢失!