我们的JavaScript分为三部分:
EcmaScript(JS核心),DOM,BOM。、
面试中经常会有面试官问我们什么是闭包?你理解的闭包是什么?优缺点?使用场景?
一:闭包的概念:
闭包就是一个的函数的返回值是另外一个函数,返回的这个函数调用了其父函数的内部变量且在外部被执行,就产生了闭包。
特点:函数嵌套函数,内部的函数可以访问外部函数的变量。
闭包=函数+自由变量。
-
优点: 1. 长期驻扎在内存中
2. 私有成员的存在
3. 可以隔离作用域,不造成全局污染 -
缺点:
由于常驻内存,使用不当可能会造成泄漏 -
如何解决内存泄漏:讲暴露在外面的变量都置为null。
使用场景:封装组件 for循环和定时器结合使用 for循环和dom事件结合 ,节流防抖函数的使用 导航栏获取下标
二:闭包实现一个计数器:
//功能:递增,递减,获取递增或递减之后的值
var Counter=function() {
//私有变量
var num=0;
//私有函数
var changeValue=function(n) {
return num+=n;
}
return {
//增
increment:function() {
changeValue(1)
},
//减
decrement:function() {
changeValue(-1)
},
//获取值
getValue:function() {
return num;
}
}
}
三:定时器的累加:
//要求每隔1秒打印1,2,3,.....10
//setTimeout是异步执行的,异步队列。
for(var i=1;i<=10;i++) {
(function(j) {
setTimeout(function() {
console.log('i=j的值:',j)
},2000*j)
})(i)
}
console.log('最后打印:',i)
for(let i=1;i<=10;i++) {
setTimeout(function() {
console.log('i的值:',i)
},1000*i)
}
四:改变页面的字体大小:
<p class="p1">我可真好看</p>
<button class="btn>改变字体</button>
//先声明一个 设置字体大小的函数
function setSize(size) {
return function() {
p1.style.fontSize=size+'px'
}
}
var size12=setSize(12);
var size40=setSize(40)
var size50=setSize(50);
var p1=document.queryselector('.p1');
var btn=document.getElementByClassName('btn');
btn=size12
btn=size40;
btn=size50;
五:封装组件:
立即调用函数
(function(win,doc) {
//私有变量
//私有方法
return {
//暴露出去的方法
}
})(window,document)