300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > 什么是闭包?闭包产生的原因以及闭包有哪些表现形式

什么是闭包?闭包产生的原因以及闭包有哪些表现形式

时间:2019-10-11 09:21:46

相关推荐

什么是闭包?闭包产生的原因以及闭包有哪些表现形式

闭包的定义:

JavaScript红宝书上对于闭包的定义:闭包是指有权访问另外一个函数作用域中的变量的函数,

MDN 对闭包的定义为:闭包是指那些能够访问自由变量的函数。

(其中自由变量,指在函数中使用的,但既不是函数参数arguments也不是函数的局部变量的变量,其实就是另外一个函数作用域中的变量。)

闭包产生的原因:

首先要明白作用域链的概念,其实很简单,在ES5中只存在两种作用域————全局作用域和函数作用 域,当访问一个变量时,解释器会首先在当前作用域查找标示符,如果没有找到,就去父作用域找,直 到找到该变量的标示符或者不在父作用域中,这就是作用域链,值得注意的是,每一个子函数都会拷贝 上级的作用域,形成一个作用域的链条。 比如:

var a = 1;function f1() {var a = 2function f2() {var a = 3;console.log(a);//3}}

在这段代码中,f1 的作用域指向有全局作用域(window)和它本身,而 f2 的作用域指向全局作用域 (window)、f1 和它本身。而且作用域是从最底层向上找,直到找到全局作用域 window 为止,如果全局 还没有的话就会报错。就这么简单一件事情!

闭包产生的本质就是,当前环境中存在指向父级作用域的引用。还是举上面的例子:

function f1() {var a = 2function f2() {console.log(a);//2}return f2;}var x = f1();x();

这里 x 会拿到父级作用域中的变量,输出2。因为在当前环境中,含有对 f2 的引用,f2 恰恰引用了 window、f1 和 f2 的作用域。因此 f2 可以访问到f1的作用域的变量。

那是不是只有返回函数才算是产生了闭包呢?

回到闭包的本质,我们只需要让父级作用域的引用存在即可,因此我们还可以这么做:

var f3;function f1() {var a = 2f3 = function() {console.log(a);}}f1();f3();

让 f1 执行,给 f3 赋值后,等于说现在 f3 拥有了 window、f1 和 f3 本身这几个作用域的访问权限,还是自底 向上查找,最近是在 f1 中找到了 a,因此输出 2。

在这里是外面的变量 f3 存在着父级作用域的引用,因此产生了闭包,形式变了,本质没有改变。

闭包有哪些表现形式:

1)返回一个函数。刚刚已经举例。

2)作为函数参数传递

var a = 1;function foo(){var a = 2;function baz(){console.log(a);}bar(baz);}function bar(fn){// 这就是闭包fn();}// 输出2,而不是1foo();

3)在定时器、事件监听、Ajax请求、跨窗口通信、Web Workers 或者任何异步中,只要使用了回调函 数,实际上就是在使用闭包。 以下的闭包保存的仅仅是window和当前作用域。

// 定时器setTimeout(function timeHandler(){console.log('111');},100)// 事件监听$('#app').click(function(){console.log('DOM Listener');})

4)IIFE(立即执行函数表达式)创建闭包, 保存了 全局作用域 window 和当前函数的作用域 ,因此可以全局的变量。

var a = 2;(function IIFE(){// 输出2console.log(a);})();

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。