深入理解JavaScript系列(16) 闭包(Closures)

介绍
本章我们将介绍在JavaScript里大家经常来讨论的话题 —— 闭包(closure)。闭包其实大家都已经谈烂了。尽管如此,这里还是要试着从理论角度来讨论下闭包,看看ECMAScript中的闭包内部究竟是如何工作的。

正如在前面的文章中提到的,这些文章都是系列文章,相互之间都是有关联的。因此,为了更好的理解本文要介绍的内容,建议先去阅读第14章作用域链和第12章变量对象。

英文原文:
概论
在直接讨论ECMAScript闭包之前,还是有必要来看一下函数式编程中一些基本定义。

众所周知,在函数式语言中(ECMAScript也支持这种风格),函数即是数据。就比方说,函数可以赋值给变量,可以当参数传递给其他函数,还可以从函数里返回等等。这类函数有特殊的名字和结构。

定义
A functional argument (“Funarg”) — is an argument which value is a function.
函数式参数(“Funarg”) —— 是指值为函数的参数。
例子:

复制代码 代码如下:


function exampleFunc(funArg) {
funArg();
}

exampleFunc(function () {
alert('funArg');
});


上述例子中funarg的实际参数其实是传递给exampleFunc的匿名函数。

反过来,接受函数式参数的函数称为高阶函数(high-order function 简称:HOF)。还可以称作:函数式函数或者偏数理或操作符。上述例子中,exampleFunc 就是这样的函数。

此前提到的,函数不仅可以作为参数,还可以作为返回值。这类以函数为返回值的函数称为带函数值的函数(functions with functional value or function valued functions)。

复制代码 代码如下:


(function functionValued() {
return function () {
alert('returned function is called');
};
})()();


可以以正常数据形式存在的函数(比方说:当参数传递,接受函数式参数或者以函数值返回)都称作 第一类函数(一般说第一类对象)。在ECMAScript中,所有的函数都是第一类对象。

函数可以作为正常数据存在(例如:当参数传递,接受函数式参数或者以函数值返回)都称作第一类函数(一般说第一类对象)。

在ECMAScript中,所有的函数都是第一类对象。

接受自己作为参数的函数,称为自应用函数(auto-applicative function 或者 self-applicative function):

复制代码 代码如下:


(function selfApplicative(funArg) {

if (funArg && funArg === selfApplicative) {
alert('self-applicative');
return;
}

selfApplicative(selfApplicative);

})();


以自己为返回值的函数称为自复制函数(auto-replicative function 或者 self-replicative function)。通常,“自复制”这个词用在文学作品中:

复制代码 代码如下:


(function selfReplicative() {
return selfReplicative;
})();


自复制函数的其中一个比较有意思的模式是让仅接受集合的一个项作为参数来接受从而代替接受集合本身。

复制代码 代码如下:


// 接受集合的函数
function registerModes(modes) {
modes.forEach(registerMode, modes);
}

// 用法
registerModes(['roster', 'accounts', 'groups']);

// 自复制函数的声明
function modes(mode) {
registerMode(mode); // 注册一个mode
return modes; // 返回函数自身
}

// 用法,modes链式调用
modes('roster')('accounts')('groups')

//有点类似:jQueryObject.addClass("a").toggle().removClass("b")


但直接传集合用起来相对来说,比较有效并且直观。

在函数式参数中定义的变量,在“funarg”激活时就能够访问了(因为存储上下文数据的变量对象每次在进入上下文的时候就创建出来了):

复制代码 代码如下:


function testFn(funArg) {
// funarg激活时, 局部变量localVar可以访问了
funArg(10); // 20
funArg(20); // 30

}

testFn(function (arg) {
var localVar = 10;
alert(arg + localVar);
});


然而,我们从第14章知道,在ECMAScript中,函数是可以封装在父函数中的,并可以使用父函数上下文的变量。这个特性会引发funarg问题。

Funarg问题
在面向堆栈的编程语言中,函数的局部变量都是保存在栈上的,每当函数激活的时候,这些变量和函数参数都会压入到该堆栈上。

当函数返回的时候,这些参数又会从栈中移除。这种模型对将函数作为函数式值使用的时候有很大的限制(比方说,作为返回值从父函数中返回)。绝大部分情况下,问题会出现在当函数有自由变量的时候。

自由变量是指在函数中使用的,但既不是函数参数也不是函数的局部变量的变量

例子:

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdjzfz.html