要了解闭包,首先需要了解一下js中的变量作用域
1、变量作用域
js中全局变量拥有全局的作用域,在js中的任何地方都是有定义的。函数内声明的变量以及函数参数都是局部变量,只在函数体内有定义。
在函数体内,局部变量的优先级高于同名的全局变量,因此全局变量就被局部变量所遮盖。
例1:
var scope = 'global' //声明一个全局变量
function checkscope(){
var scope = 'local' //声明一个同名的局部变量
return scope
}
checkscope() //local
函数定义是可以嵌套的,因此会出现几个局部作用域嵌套的情况,
例2
var scope = 'global'
function checkscope() {
var scope = 'local'
function nested() {
var scope = 'nexted'
return scope
}
return nested()
}
checkscope() //nexted
js中没有块级作用域,取而代之的是函数作用域。变量在声明它们的函数体内以及嵌套的函数体内都是有定义的(函数内声明的所有变量在函数内始终是可见的,这意味着变量在声明之前就已经可用(声明提前))。
var scope = 'global'
function f() {
console.log(scope) //undifind,不是global
var scope = 'local'
console.log(scope) //local
}
2、变量作用域链
每段js代码都有一个与之对应的作用域链,这个作用域链是一个对象列表或者链表。这组对象定义了这段代码的变量。当js需要查找一个为x的变量时,它会从这个对象列表的第一个对象查找,如果这个对象有一个叫做x的属性,那么就会使用这个属性值。如果没有,则会从下一个对象继续寻找。如果整个对象列表(作用域链)中都没有一个叫做x的属性,那么会返回异常。
在例2的嵌套函数中,该段代码的作用域链有3个对象,第一个对象定义了nested函数的参数以及函数体内的变量,第二个定义了checkscope函数的参数以及该函数体内的变量,第三个则是全局对象。因此,在nested函数体内,查找scope变量的值,首先是从第一个对象中查找,找到了scope的值为nested。
3、闭包
上面说到了js采用词法作用域,该作用域是在函数定义时决定的,而不是在函数调用时决定。为了实现这种词法作用域,函数对象不光要包含代码逻辑,还要引用一个作用域链。函数对象可以通过作用域链相互关联起来,函数体内部的变量都可以保存在函数作用域内,这种特性叫做“闭包”。
我们将例2的代码修改一下:
var scope = 'global'
function checkscope() {
var scope = 'local'
function nested() {
return scope
}
return nested
}
checkscope()() //会返回什么呢?
回想一下词法作用域规则:nested函数执行时使用到了作用域链,该作用域链在函数定义的时候就创建了。无论何时何地执行nested函数,这种绑定依然有效。因此最后一行代码会返回‘local’而不是‘global’。因此,闭包这个特性可以捕捉到局部变量或者参数。
参考书籍:
《javaScript权威指南》