符合中小企业对网站设计、功能常规化式的企业展示型网站建设
本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...
商城网站建设因基本功能的需求不同费用上面也有很大的差别...
手机微信网站开发、微信官网、微信商城网站...
闭包是什么
为城关等地区用户提供了全套网页设计制作服务,及城关网站建设行业解决方案。主营业务为成都网站建设、成都网站设计、城关网站设计,以传统方式定制建设网站,并提供域名空间备案等一条龙服务,秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求,就会得到认可,从而选择与我们长期合作。这样,我们也可以走得更远!
在 JavaScript 中,闭包是一个让人很难弄懂的概念。ECMAScript 中给闭包的定义是:闭包,指的是词法表示包括不被计算的变量的函数,也就是说,函数可以使用函数之外定义的变量。
是不是看完这个定义感觉更加懵逼了?别急,我们来分析一下。
好像有点清晰了,但是使用在它外面定义的变量是什么意思,我们先来看看变量作用域。
变量作用域
变量可分为全局变量和局部变量。全局变量的作用域就是全局性的,在 js 的任何地方都可以使用全局变量。在函数中使用 var 关键字声明变量,这时的变量即是局部变量,它的作用域只在声明该变量的函数内,在函数外面是访问不到该变量的。
var func = function(){ var a = 'linxin'; console.log(a); // linxin } func(); console.log(a); // Uncaught ReferenceError: a is not defined
作用域相对比较简单,我们不多讲,来看看跟闭包关系比较大的变量生存周期。
变量生存周期
全局变量,生命周期是永久的。局部变量,当定义该变量的函数调用结束时,该变量就会被垃圾回收机制回收而销毁。再次调用该函数时又会重新定义了一个新变量。
var func = function(){ var a = 'linxin'; console.log(a); } func();
a 为局部变量,在 func 调用完之后,a 就会被销毁了。
var func = function(){ var a = 'linxin'; var func1 = function(){ a += ' a'; console.log(a); } return func1; } var func2 = func(); func2(); // linxin a func2(); // linxin a a func2(); // linxin a a a
可以看出,在第一次调用完 func2 之后,func 中的变量 a 变成 'linxin a',而没有被销毁。因为此时 func1 形成了一个闭包,导致了 a 的生命周期延续了。
这下子闭包就比较明朗了。
现在可以说,满足这三个条件的就是闭包了。
下面我们通过一个简单而又经典的例子来进一步熟悉闭包。
for (var i = 0; i < 4; i++) { setTimeout(function () { console.log(i) }, 0) }
我们可能会简单的以为控制台会打印出 0 1 2 3,可事实却打印出了 4 4 4 4,这又是为什么呢?我们发现,setTimeout 函数时异步的,等到函数执行时,for循环已经结束了,此时的 i 的值为 4,所以 function() { console.log(i) } 去找变量 i,只能拿到 4。
我们想起上一个例子中,闭包使 a 变量的值被保存起来了,那么这里我们也可以用闭包把 0 1 2 3 保存起来。
for (var i = 0; i < 4; i++) { (function (i) { setTimeout(function () { console.log(i) }, 0) })(i) }
当 i=0 时,把 0 作为参数传进匿名函数中,此时 function(i){} 此匿名函数中的 i 的值为 0,等到 setTimeout 执行时顺着外层去找 i,这时就能拿到 0。如此循环,就能拿到想要的 0 1 2 3。
内存管理
在闭包中调用局部变量,会导致这个局部变量无法及时被销毁,相当于全局变量一样会一直占用着内存。如果需要回收这些变量占用的内存,可以手动将变量设置为null。
然而在使用闭包的过程中,比较容易形成 JavaScript 对象和 DOM 对象的循环引用,就有可能造成内存泄露。这是因为浏览器的垃圾回收机制中,如果两个对象之间形成了循环引用,那么它们都无法被回收。
function func() { var test = document.getElementById('test'); test.onclick = function () { console.log('hello world'); } }
在上面例子中,func 函数中用匿名函数创建了一个闭包。变量 test 是 JavaScript 对象,引用了 id 为 test 的 DOM 对象,DOM 对象的 onclick 属性又引用了闭包,而闭包又可以调用 test ,因而形成了循环引用,导致两个对象都无法被回收。要解决这个问题,只需要把循环引用中的变量设为 null 即可。
function func() { var test = document.getElementById('test'); test.onclick = function () { console.log('hello world'); } test = null; }
如果在 func 函数中不使用匿名函数创建闭包,而是通过引用一个外部函数,也不会出现循环引用的问题。
function func() { var test = document.getElementById('test'); test.onclick = funcTest; } function funcTest(){ console.log('hello world'); }
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持创新互联!