JS闭包原理及其使用场景解析

闭包定义

可以通过内层函数访问外层函数的作用域的组合叫做闭包。

闭包使用场景

使用闭包来实现防抖

function debounce(callback, time) {
var timer;
return function () {
if (timer) {
clearTimeout(timer)
}
timer = setTimeout(() => {
callback()
}, time)
}
}<br data-filtered="filtered"><br data-filtered="filtered">window.onresize = debounce(() => {console.log(666)},500)

使用闭包设计单例模式

class Car{
constructor(color){
this.color = color
}
}
var proxy = (function createCar() {
var instance;
return function (color) {
if (!instance) {
instance = new Car(color)
}
return instance
}
})()
var car = proxy('white')

使用闭包遍历取索引值（古老的问题）

for (var i = 0; i < 10; i++) {
setTimeout(function(){console.log(i)},0) //10个10
}
for (var i = 0; i < 10; i++) {
(function(j){
setTimeout(function(){console.log(j)},0) // 0 - 9
})(i)
}

闭包性能

因为闭包会使外层函数作用域中的变量被保存在内存中不被回收，所以如果滥用闭包就会导致性能问题，谨记。

以上就是本文的全部内容，希望对大家的学习有所帮助

• 详解JavaScript作用域、作用域链和闭包的用法
• 详解JavaScript作用域 闭包
• 详解JavaScript匿名函数和闭包
• 深入了解JS之作用域和闭包
• JavaScript 函数用法详解【函数定义、参数、绑定、作用域、闭包等】
• JS页面获取 session 值，作用域和闭包学习笔记
• JS常见面试试题总结【去重、遍历、闭包、继承等】
• 浅谈JavaScript闭包