主要讲了闭包是什么 闭包造成的内存泄漏 匿名函数模拟私有变量 匿名函数模拟块级作用域 匿名函数模拟单例类
作用域链：函数在定义的时候会有一个条作用域链，然后再调用时会将创建一个对象用于存储函数的局部变量，这个对象会被加到作用域链中。
当函数返回的时候，会将这个对象从作用域链移除。
如果没有嵌套函数也没有其他变量指向这个对象，那么就会被当成垃圾回收
如果定义了嵌套函数，那么每个嵌套函数都各自对应一条作用域链，并且会创建一个对象存储嵌套函数的局部变量
如果嵌套函数保存在外部函数中保存下来，那么当执行完后嵌套函数也会随着外部函数一起销毁
如果把嵌套函数当做返回值或者存储在某个属性里，这时就会有一个外部引用指向这个嵌套函数，它就不会被销毁。这条作用域链也被保存下来
闭包就是有权访问另一个函数作用域内的变量的函数，最常见的方式就是在一个函数的内部在定义一个函数.
1: 闭包与变量
闭包只能取到函数中变量的最后一个值.闭包是将整个对象保存下来了,并不是存的是某个特殊的值,所以就有可能出现下面的问题
function createFunctions(){
var result = new Array();
for (var i=0; i < 10; i++){
result[i] = function(){
return i;
};
}
return result;
}
result数组中所有的元素都是10
避免这种情况发生的解决办法就是在函数内部定义一个匿名函数,然后让它直接执行
var result = []
function function1 () {
var result = []
for (var i=0; i<10; i++) {
result[i] = (function (i){
return i
})(i)
}
return result
}
2: 闭包造成内存泄漏
function f () {
var elent = document.getElementById("someElement");
elent.onclick = function () {
alert(elent.id)
}
}
在闭包中引用了elent这个dom元素,在这个闭包销毁之前,这个dom元素是不会销毁的,这就造成了内存泄漏,解决方法如下:
function f () {
var elent = document.getElementById("someElement");
var id = elent.id
elent.onclick = function () {
alert(id)
}
elent = null
}
将id放到一个变量中,切记需要将elent设置为null,因为闭包是引用整个活动对象,不是引用一个变量,将elent设置为null,就可以将elent这个dom元素给释放了
3: 匿名函数实现块级作用域 (私有变量)
function f1 () {
(function () {
for ( var i=0; i<10; i++){
alert(i)
}
})()
alert(i) // 导致一个错误
}
在匿名函数中定义的变量,在函数运行结束后,会被销毁
4:匿名函数模拟静态私有变量
思路:在匿名函数中定义一个变量,这个变量就是静态私有变量,访问私有变量方法:定义一个构造函数,然后在构造函数的原型对象上添加一个方法,这个方法用于返回匿名函数中的变量
var Person = function(){
};
(function(){
var name = "";
Person = function(value){
name = value;
};
Person.prototype.getName = function(){
return name;
};
Person.prototype.setName = function (value){
name = value;
};
})();
var person1 = new Person("Nicholas");
alert(person1.getName()); //"Nicholas"
5:匿名函数模拟单例
思路:在匿名函数内部初始化一个对象,然后将操作这个对象的方法返回,在外部便可以对这个对象进行操作
var singe = (function () {
var componentList = []
componentList.push('fist')
return {
componentCount: function (){ return componentList.length},
registerComponent: function (component){
if (typeof component === 'object')
componentList.push(component)
}
}
})()