对闭包的理解?使用场景?注意事项?

什么是闭包

闭包: 有权利访问另一个函数作用域中的变量

  • 闭包可以重用一个变量,且保证这个变量不会被污染
  • 这些变量的值始终保持在内存中,不会被垃圾回收机制处理

闭包的缺点: 由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。

为什么要用闭包: 使用场景 : 防抖、节流、函数套函数避免全局污染

闭包原理: 函数执行分成两个阶段(预编译阶段和执行阶段) ​

  1. 在预编译阶段,如果发现内部函数使用了外部函数的变量,则会在内存中创建一个"闭包"对象并保存对应变量值,如果已存在"闭包",则只需要增加对应属性值即可。
  2. 执行完后,函数执行上下文会被销毁,函数对"闭包"对象的引用也会被销毁,但其内部函数还持用该"闭包"的引用,所以内部函数可以继续使用"外部函数"中的变量

​ 利用了函数作用域链的特性,一个函数内部定义的函数会将包含外部函数的活动对象添加到它的作用域链中,函数执行完毕,其执行作用域链销毁, 但因内部函数的作用域链仍然在引用这个活动对象,所以其活动对象不会被销毁,直到内部函数被烧毁后才被销毁。

闭包的使用场景

  • 模块化开发:利用闭包实现模块化开发,将不同的功能封装成独立的模块,提高代码的可维护性和复用性。
  • 懒加载:通过闭包延迟初始化某些资源,只有在真正需要时才进行加载,从而减少初始加载时间。
  • 缓存机制:利用闭包保存计算结果,避免重复计算,提升应用性能。
  • 防抖与节流:结合闭包实现防抖(Debouncing)和节流(Throttling)功能,控制事件触发频率,防止过度响应用户操作。
  • 柯里化

闭包的注意事项

虽然闭包非常强大,但在实际开发中也需要谨慎使用,以避免潜在的性能问题和内存泄漏。

1. 内存泄漏

闭包会延长变量的生命周期,导致它们不能及时被垃圾回收机制释放。特别是在长时间运行的应用程序中,如果不小心管理闭包,可能会占用大量内存。

2. 避免不必要的闭包

尽量减少不必要的闭包使用,特别是那些只在局部范围内使用的变量。可以通过将变量声明移到函数外部或使用立即执行函数表达式(IIFE)来限制变量的作用域。

3. 及时解除引用

对于不再需要的闭包,应该主动解除对相关变量的引用,以便让垃圾回收机制能够及时清理内存。例如,在移除事件监听器时,记得调用removeEventListener方法。

4. 性能优化 闭包的使用会影响JavaScript引擎的优化效果,因为闭包的存在使得变量无法被内联或提前分配。为了提高性能,可以考虑以下几种优化策略:

  1. 减少闭包层数:尽量简化嵌套结构,避免过多的闭包层次
  2. 避免频繁创建闭包:如果某个函数会被频繁调用,尽量避免每次都创建新的闭包,而是复用已有的闭包。
  3. 使用类和原型继承:对于面向对象编程,可以考虑使用类和原型继承代替闭包,以降低内存消耗和提
相关推荐
高山我梦口香糖8 分钟前
[electron]预脚本不显示内联script
前端·javascript·electron
拉不动的猪1 小时前
安卓和ios小程序开发中的兼容性问题举例
前端·javascript·面试
贩卖纯净水.2 小时前
浏览器兼容-polyfill-本地服务-优化
开发语言·前端·javascript
程序研2 小时前
一、ES6-let声明变量【解刨分析最详细】
前端·javascript·es6
疯狂的沙粒3 小时前
在uni-app中如何从Options API迁移到Composition API?
javascript·vue.js·uni-app
xiaominlaopodaren3 小时前
Three.js 光影魔法:如何单独点亮你的3D模型
javascript
PasserbyX3 小时前
一句话解释JS链式调用
前端·javascript
1024小神3 小时前
tauri项目,如何在rust端读取电脑环境变量
前端·javascript
古夕3 小时前
如何将异步操作封装为Promise
前端·javascript
@一枝梅3 小时前
vue3 vite.config.js 引入bem.scss文件报错
javascript·rust·vue·scss